From 8e6c99aff74fce69be81b038a2bc8681d3492450 Mon Sep 17 00:00:00 2001
From: Manuel Martin <imanol.martin@gmail.com>
Date: Mon, 15 Jul 2019 19:45:54 +0200
Subject: [PATCH 1/3] Added support for tooltips

wip
---
 .../mozilla/vrbrowser/ui/views/UIButton.java  |  87 +++++++++++--
 .../vrbrowser/ui/widgets/TooltipWidget.java   | 120 ++++++++++++++++++
 .../vrbrowser/ui/widgets/TrayWidget.java      |   4 +
 .../vrbrowser/ui/widgets/WidgetPlacement.java |   7 +
 .../mozilla/vrbrowser/utils/ViewUtils.java    |  44 +++++++
 .../main/res/drawable/tooltip_background.xml  |   7 +
 app/src/main/res/layout/navigation_bar.xml    |  10 +-
 app/src/main/res/layout/navigation_url.xml    |   2 +
 app/src/main/res/layout/tooltip.xml           |  25 ++++
 app/src/main/res/layout/tray.xml              |  12 +-
 app/src/main/res/values/attrs.xml             |   9 ++
 app/src/main/res/values/colors.xml            |   2 +
 app/src/main/res/values/dimen.xml             |   5 +
 app/src/main/res/values/strings.xml           |  35 ++++-
 14 files changed, 352 insertions(+), 17 deletions(-)
 create mode 100644 app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/TooltipWidget.java
 create mode 100644 app/src/common/shared/org/mozilla/vrbrowser/utils/ViewUtils.java
 create mode 100644 app/src/main/res/drawable/tooltip_background.xml
 create mode 100644 app/src/main/res/layout/tooltip.xml

diff --git a/app/src/common/shared/org/mozilla/vrbrowser/ui/views/UIButton.java b/app/src/common/shared/org/mozilla/vrbrowser/ui/views/UIButton.java
index 46e4141d8..402ed2cad 100644
--- a/app/src/common/shared/org/mozilla/vrbrowser/ui/views/UIButton.java
+++ b/app/src/common/shared/org/mozilla/vrbrowser/ui/views/UIButton.java
@@ -5,17 +5,23 @@
 
 package org.mozilla.vrbrowser.ui.views;
 
+import android.annotation.TargetApi;
 import android.content.Context;
 import android.content.res.ColorStateList;
 import android.content.res.TypedArray;
 import android.graphics.drawable.Drawable;
+import android.os.Build;
 import android.util.AttributeSet;
-
-import org.mozilla.vrbrowser.R;
+import android.view.MotionEvent;
 
 import androidx.annotation.IdRes;
 import androidx.appcompat.widget.AppCompatImageButton;
 
+import org.mozilla.vrbrowser.R;
+import org.mozilla.vrbrowser.ui.widgets.TooltipWidget;
+import org.mozilla.vrbrowser.ui.widgets.UIWidget;
+import org.mozilla.vrbrowser.utils.ViewUtils;
+
 public class UIButton extends AppCompatImageButton implements CustomUIButton {
 
     private enum State {
@@ -31,7 +37,12 @@ private enum State {
     private @IdRes int mTintColorListRes;
     private @IdRes int mPrivateModeTintColorListRes;
     private @IdRes int mActiveModeTintColorListRes;
+    private TooltipWidget mTooltipView;
+    private String mTooltipText;
     private State mState;
+    private int mTooltipDelay;
+    private float mTooltipDensity;
+    private ViewUtils.TooltipPosition mTooltipPosition;
 
     public UIButton(Context context, AttributeSet attrs) {
         this(context, attrs, R.attr.imageButtonStyle);
@@ -45,22 +56,17 @@ public UIButton(Context context, AttributeSet attrs, int defStyleAttr) {
         if (mTintColorListRes != 0) {
             setTintColorList(mTintColorListRes);
         }
-        attributes.recycle();
-
-        attributes = context.obtainStyledAttributes(attrs, R.styleable.UIButton, defStyleAttr, 0);
         mPrivateModeBackground = attributes.getDrawable(R.styleable.UIButton_privateModeBackground);
-        attributes.recycle();
-
-        attributes = context.obtainStyledAttributes(attrs, R.styleable.UIButton, defStyleAttr, 0);
         mActiveModeBackground = attributes.getDrawable(R.styleable.UIButton_activeModeBackground);
-        attributes.recycle();
-
-        attributes = context.obtainStyledAttributes(attrs, R.styleable.UIButton, defStyleAttr, 0);
         mPrivateModeTintColorListRes = attributes.getResourceId(R.styleable.UIButton_privateModeTintColorList, 0);
-        attributes.recycle();
-
-        attributes = context.obtainStyledAttributes(attrs, R.styleable.UIButton, defStyleAttr, 0);
         mActiveModeTintColorListRes = attributes.getResourceId(R.styleable.UIButton_activeModeTintColorList, 0);
+        mTooltipDelay = attributes.getInt(R.styleable.UIButton_tooltipDelay, getResources().getInteger(R.integer.tooltip_delay));
+        mTooltipPosition = ViewUtils.TooltipPosition.fromId(attributes.getInt(R.styleable.UIButton_tooltipPosition, ViewUtils.TooltipPosition.BOTTOM.ordinal()));
+        mTooltipDensity = attributes.getFloat(R.styleable.UIButton_tooltipDensity, getContext().getResources().getDisplayMetrics().density);
+        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.O) {
+            TypedArray arr = context.obtainStyledAttributes(attrs, new int [] {android.R.attr.tooltipText});
+            mTooltipText = arr.getString(0);
+        }
         attributes.recycle();
 
         mBackground = getBackground();
@@ -68,6 +74,37 @@ public UIButton(Context context, AttributeSet attrs, int defStyleAttr) {
         mState = State.NORMAL;
     }
 
+    @TargetApi(Build.VERSION_CODES.O)
+    public String getTooltip() {
+        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.O)
+            return mTooltipText;
+        else
+            return getTooltipText().toString();
+    }
+
+    @TargetApi(Build.VERSION_CODES.O)
+    public void setTooltip(String text) {
+        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.O)
+            mTooltipText = text;
+        else
+            setTooltipText(text);
+    }
+
+    @Override
+    public boolean onHoverEvent(MotionEvent event) {
+        if (getTooltip() != null) {
+            if (event.getAction() == MotionEvent.ACTION_HOVER_ENTER) {
+                getHandler().postDelayed(mShowTooltipRunnable, mTooltipDelay);
+
+            } else if (event.getAction() == MotionEvent.ACTION_HOVER_EXIT) {
+                getHandler().removeCallbacks(mShowTooltipRunnable);
+                getHandler().post(mHideTooltipRunnable);
+            }
+        }
+
+        return super.onHoverEvent(event);
+    }
+
     public void setTintColorList(int aColorListId) {
         mTintColorList = getContext().getResources().getColorStateList(
                 aColorListId,
@@ -144,4 +181,26 @@ private void setActive() {
         }
     }
 
+    private Runnable mShowTooltipRunnable = new Runnable() {
+        @Override
+        public void run() {
+            if (mTooltipView != null && mTooltipView.isVisible())
+                return;
+
+            mTooltipView = new TooltipWidget(getContext());
+            mTooltipView.setText(getTooltip());
+            mTooltipView.setLayoutParams(UIButton.this, mTooltipPosition, mTooltipDensity);
+            mTooltipView.show(UIWidget.CLEAR_FOCUS);
+        }
+    };
+
+    private Runnable mHideTooltipRunnable = new Runnable() {
+        @Override
+        public void run() {
+            if (mTooltipView != null) {
+                mTooltipView.hide(UIWidget.REMOVE_WIDGET);
+            }
+        }
+    };
+
 }
diff --git a/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/TooltipWidget.java b/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/TooltipWidget.java
new file mode 100644
index 000000000..c4ff45b97
--- /dev/null
+++ b/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/TooltipWidget.java
@@ -0,0 +1,120 @@
+package org.mozilla.vrbrowser.ui.widgets;
+
+import android.content.Context;
+import android.graphics.PointF;
+import android.graphics.Rect;
+import android.view.View;
+import android.view.ViewGroup;
+import android.view.ViewTreeObserver;
+import android.widget.TextView;
+
+import org.mozilla.vrbrowser.R;
+import org.mozilla.vrbrowser.utils.ViewUtils;
+
+public class TooltipWidget extends UIWidget {
+
+    private View mTargetView;
+    private UIWidget mParentWidget;
+    protected TextView mText;
+    private PointF mTranslation;
+    private float mRatio;
+    private int mPaddingH;
+    private int mPaddingV;
+
+    public TooltipWidget(Context aContext) {
+        super(aContext);
+
+        initialize();
+    }
+
+    private void initialize() {
+        inflate(getContext(), R.layout.tooltip, this);
+
+        mText = findViewById(R.id.tooltipText);
+
+        ViewGroup layout = findViewById(R.id.layout);
+        mPaddingH = layout.getPaddingStart() + layout.getPaddingEnd();
+        mPaddingV = layout.getPaddingTop() + layout.getPaddingBottom();
+    }
+
+    @Override
+    protected void initializeWidgetPlacement(WidgetPlacement aPlacement) {
+        aPlacement.visible = false;
+        aPlacement.width =  0;
+        aPlacement.height = 0;
+        aPlacement.parentAnchorX = 0.0f;
+        aPlacement.parentAnchorY = 1.0f;
+        aPlacement.anchorX = 0.5f;
+        aPlacement.anchorY = 0.5f;
+        aPlacement.translationZ = WidgetPlacement.unitFromMeters(getContext(), R.dimen.tooltip_z_distance);
+    }
+
+    @Override
+    public void show(@ShowFlags int aShowFlags) {
+        measure(MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED),
+                MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));
+        mWidgetPlacement.translationX = mTranslation.x * (mRatio / mWidgetPlacement.density);
+        mWidgetPlacement.translationY = mTranslation.y * (mRatio / mWidgetPlacement.density);
+        mWidgetPlacement.width = (int)((getMeasuredWidth() + mPaddingH)/mWidgetPlacement.density);
+        mWidgetPlacement.height = (int)((getMeasuredHeight() + mPaddingV)/mWidgetPlacement.density);
+        super.show(aShowFlags);
+
+        ViewTreeObserver viewTreeObserver = getViewTreeObserver();
+        if (viewTreeObserver.isAlive()) {
+            viewTreeObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
+                @Override
+                public void onGlobalLayout() {
+                    getViewTreeObserver().removeOnGlobalLayoutListener(this);
+                    mWidgetPlacement.width = (int)(getWidth() / mWidgetPlacement.density);
+                    mWidgetPlacement.height = (int)(getHeight() / mWidgetPlacement.density);
+                    mWidgetManager.updateWidget(TooltipWidget.this);
+                }
+            });
+        }
+    }
+
+    public void setLayoutParams(View targetView) {
+        this.setLayoutParams(targetView, ViewUtils.TooltipPosition.BOTTOM);
+    }
+
+    public void setLayoutParams(View targetView, ViewUtils.TooltipPosition position) {
+        this.setLayoutParams(targetView, position, mWidgetPlacement.density);
+    }
+
+    public void setLayoutParams(View targetView, ViewUtils.TooltipPosition position, float density) {
+        mTargetView = targetView;
+        mParentWidget = ViewUtils.getParentWidget(mTargetView);
+        if (mParentWidget != null) {
+            mRatio = WidgetPlacement.worldToWidgetRatio(mParentWidget);
+
+            Rect offsetViewBounds = new Rect();
+            getDrawingRect(offsetViewBounds);
+            mParentWidget.offsetDescendantRectToMyCoords(mTargetView, offsetViewBounds);
+
+            mWidgetPlacement.parentHandle = mParentWidget.getHandle();
+            // At the moment we only support showing tooltips on top or bottom of the target view
+            if (position == ViewUtils.TooltipPosition.BOTTOM) {
+                mWidgetPlacement.density = density;
+                mWidgetPlacement.anchorY = 1.0f;
+                mWidgetPlacement.parentAnchorY = 0.0f;
+                float densityRatio = mWidgetPlacement.density / getContext().getResources().getDisplayMetrics().density;
+                mTranslation = new PointF(
+                        (offsetViewBounds.left + mTargetView.getWidth() / 2) * densityRatio,
+                        -offsetViewBounds.top * densityRatio);
+            } else {
+                mWidgetPlacement.density = density;
+                mWidgetPlacement.anchorY = 0.0f;
+                mWidgetPlacement.parentAnchorY = 1.0f;
+                float densityRatio = mWidgetPlacement.density / getContext().getResources().getDisplayMetrics().density;
+                mTranslation = new PointF(
+                        (offsetViewBounds.left + mTargetView.getWidth() / 2) * densityRatio,
+                        offsetViewBounds.top * densityRatio);
+            }
+        }
+    }
+
+    public void setText(String text) {
+        mText.setText(text);
+    }
+
+}
diff --git a/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/TrayWidget.java b/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/TrayWidget.java
index 7b99a9deb..8a033bb04 100644
--- a/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/TrayWidget.java
+++ b/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/TrayWidget.java
@@ -248,10 +248,12 @@ private void handleSessionState() {
             if (isPrivateMode) {
                 mWidgetManager.pushWorldBrightness(this, WidgetManagerDelegate.DEFAULT_DIM_BRIGHTNESS);
                 mPrivateButton.setImageResource(R.drawable.ic_icon_private_browsing_on);
+                mPrivateButton.setTooltip(getResources().getString(R.string.private_browsing_exit_tooltip));
 
             } else {
                 mWidgetManager.popWorldBrightness(this);
                 mPrivateButton.setImageResource(R.drawable.ic_icon_private_browsing);
+                mPrivateButton.setTooltip(getResources().getString(R.string.private_browsing_enter_tooltip));
             }
         }
 
@@ -329,11 +331,13 @@ private void onHelpButtonClicked() {
 
     @Override
     public void onBookmarksShown() {
+        mBookmarksButton.setTooltip(getResources().getString(R.string.close_bookmarks_tooltip));
         mBookmarksButton.setActiveMode(true);
     }
 
     @Override
     public void onBookmarksHidden() {
+        mBookmarksButton.setTooltip(getResources().getString(R.string.open_bookmarks_tooltip));
         mBookmarksButton.setActiveMode(false);
     }
 
diff --git a/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/WidgetPlacement.java b/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/WidgetPlacement.java
index be907f509..7a15daff0 100644
--- a/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/WidgetPlacement.java
+++ b/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/WidgetPlacement.java
@@ -10,6 +10,8 @@
 import android.util.DisplayMetrics;
 import android.util.TypedValue;
 
+import androidx.annotation.NonNull;
+
 public class WidgetPlacement {
     static final float WORLD_DPI_RATIO = 2.0f/720.0f;
 
@@ -126,4 +128,9 @@ public static float convertPixelsToDp(Context aContext, float px){
         return px / ((float) aContext.getResources().getDisplayMetrics().densityDpi / DisplayMetrics.DENSITY_DEFAULT);
     }
 
+    public static float worldToWidgetRatio(@NonNull UIWidget widget) {
+        float widgetWorldWidth = widget.mWidgetPlacement.worldWidth;
+        return ((widgetWorldWidth/widget.mWidgetPlacement.width)/WORLD_DPI_RATIO);
+    }
+
 }
diff --git a/app/src/common/shared/org/mozilla/vrbrowser/utils/ViewUtils.java b/app/src/common/shared/org/mozilla/vrbrowser/utils/ViewUtils.java
new file mode 100644
index 000000000..07b3cb65e
--- /dev/null
+++ b/app/src/common/shared/org/mozilla/vrbrowser/utils/ViewUtils.java
@@ -0,0 +1,44 @@
+package org.mozilla.vrbrowser.utils;
+
+import android.view.View;
+import android.view.ViewParent;
+
+import androidx.annotation.NonNull;
+
+import org.mozilla.vrbrowser.ui.widgets.UIWidget;
+
+public class ViewUtils {
+
+    public enum TooltipPosition {
+        TOP(0), BOTTOM(1);
+        int id;
+
+        TooltipPosition(int id) {
+            this.id = id;
+        }
+
+        public static TooltipPosition fromId(int id) {
+            for (TooltipPosition f : values()) {
+                if (f.id == id) return f;
+            }
+            throw new IllegalArgumentException();
+        }
+    }
+
+    public static UIWidget getParentWidget(@NonNull View view) {
+        if (view == null)
+            return null;
+
+        ViewParent v = view.getParent();
+        if (v instanceof UIWidget) {
+            return (UIWidget)v;
+
+        } else if (v instanceof View){
+            return getParentWidget((View)v);
+
+        } else {
+            return null;
+        }
+    }
+
+}
diff --git a/app/src/main/res/drawable/tooltip_background.xml b/app/src/main/res/drawable/tooltip_background.xml
new file mode 100644
index 000000000..409baa5aa
--- /dev/null
+++ b/app/src/main/res/drawable/tooltip_background.xml
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+       android:shape="rectangle">
+    <corners android:radius="30dp" />
+    <stroke android:color="@color/rhino_blur" android:width="@dimen/blur_radius" />
+    <solid android:color="@color/rhino"/>
+</shape>
\ No newline at end of file
diff --git a/app/src/main/res/layout/navigation_bar.xml b/app/src/main/res/layout/navigation_bar.xml
index 5738ac407..42d149850 100644
--- a/app/src/main/res/layout/navigation_bar.xml
+++ b/app/src/main/res/layout/navigation_bar.xml
@@ -1,5 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
-<merge xmlns:android="http://schemas.android.com/apk/res/android">
+<merge xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto">
     <RelativeLayout
         android:layout_width="match_parent"
         android:layout_height="40dp"
@@ -17,6 +18,7 @@
                 style="?attr/navigationBarButtonStyle"
                 android:layout_weight="1"
                 android:tint="@color/midnight"
+                android:tooltipText="@string/back_tooltip"
                 android:src="@drawable/ic_icon_back" />
 
             <org.mozilla.vrbrowser.ui.views.UIButton
@@ -24,6 +26,7 @@
                 style="?attr/navigationBarButtonStyle"
                 android:layout_weight="1"
                 android:layout_marginStart="10dp"
+                android:tooltipText="@string/forward_tooltip"
                 android:src="@drawable/ic_icon_forward" />
 
             <org.mozilla.vrbrowser.ui.views.UIButton
@@ -31,6 +34,7 @@
                 style="?attr/navigationBarButtonStyle"
                 android:layout_weight="1"
                 android:layout_marginStart="10dp"
+                android:tooltipText="@string/refresh_tooltip"
                 android:src="@drawable/ic_icon_reload" />
 
             <org.mozilla.vrbrowser.ui.views.UIButton
@@ -38,6 +42,7 @@
                 style="?attr/navigationBarButtonStyle"
                 android:layout_weight="1"
                 android:layout_marginStart="10dp"
+                android:tooltipText="@string/home_tooltip"
                 android:src="@drawable/ic_icon_home" />
 
             <org.mozilla.vrbrowser.ui.views.NavigationURLBar
@@ -54,6 +59,7 @@
                 style="?attr/navigationBarButtonStyle"
                 android:layout_weight="1"
                 android:layout_marginStart="10dp"
+                android:tooltipText="@string/servo_tooltip"
                 android:src="@drawable/ic_icon_servo" />
 
             <org.mozilla.vrbrowser.ui.views.UIButton
@@ -61,6 +67,7 @@
                 style="?attr/navigationBarButtonStyle"
                 android:layout_weight="1"
                 android:layout_marginStart="10dp"
+                android:tooltipText="@string/resize_tooltip"
                 android:src="@drawable/ic_icon_resize" />
         </LinearLayout>
 
@@ -85,6 +92,7 @@
             <org.mozilla.vrbrowser.ui.views.UIButton
                 android:id="@+id/projectionButton"
                 style="?attr/fullScreenButtonStyle"
+                android:tooltipText="@string/video_mode_tooltip"
                 android:src="@drawable/ic_icon_vr_projection" />
             <org.mozilla.vrbrowser.ui.views.UIButton
                 android:id="@+id/brightnessButton"
diff --git a/app/src/main/res/layout/navigation_url.xml b/app/src/main/res/layout/navigation_url.xml
index b0ca61d59..c4a635c6c 100644
--- a/app/src/main/res/layout/navigation_url.xml
+++ b/app/src/main/res/layout/navigation_url.xml
@@ -66,12 +66,14 @@
                 android:id="@+id/microphoneButton"
                 style="@style/urlBarIconTheme"
                 android:src="@drawable/ic_icon_microphone"
+                android:tooltipText="@string/voice_search_tooltip"
                 android:tint="@color/fog" />
 
             <org.mozilla.vrbrowser.ui.views.UIButton
                 android:id="@+id/bookmarkButton"
                 style="@style/urlBarIconThemeEnd"
                 android:src="@drawable/ic_icon_bookmark"
+                android:tooltipText="@string/bookmark_tooltip"
                 android:tint="@color/fog" />
         </LinearLayout>
     </FrameLayout>
diff --git a/app/src/main/res/layout/tooltip.xml b/app/src/main/res/layout/tooltip.xml
new file mode 100644
index 000000000..654464db5
--- /dev/null
+++ b/app/src/main/res/layout/tooltip.xml
@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="utf-8"?>
+<merge xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools">
+
+    <FrameLayout
+        android:id="@+id/layout"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:padding="15dp"
+        android:layout_gravity="center"
+        android:background="@drawable/tooltip_background">
+
+        <TextView
+            android:id="@+id/tooltipText"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_gravity="center"
+            android:gravity="center"
+            android:textSize="@dimen/text_biggest_size"
+            android:maxLines="1"
+            android:singleLine="true"
+            android:textColor="@color/smoke"
+            tools:text="Text" />
+    </FrameLayout>
+</merge>
\ No newline at end of file
diff --git a/app/src/main/res/layout/tray.xml b/app/src/main/res/layout/tray.xml
index 4805dc8d7..9ddbe97f3 100644
--- a/app/src/main/res/layout/tray.xml
+++ b/app/src/main/res/layout/tray.xml
@@ -1,5 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
-<merge xmlns:android="http://schemas.android.com/apk/res/android">
+<merge xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto">
     <RelativeLayout
         android:layout_width="match_parent"
         android:layout_height="match_parent"
@@ -18,16 +19,25 @@
             <org.mozilla.vrbrowser.ui.views.UIButton
                 android:id="@+id/privateButton"
                 style="@style/trayButtonMiddleTheme"
+                android:tooltipText="@string/private_browsing_enter_tooltip"
+                app:tooltipDensity="@dimen/tray_tooltip_density"
+                app:tooltipPosition="top"
                 android:src="@drawable/ic_icon_private_browsing"/>
 
             <org.mozilla.vrbrowser.ui.views.UIButton
                 android:id="@+id/bookmarksButton"
                 style="@style/trayButtonMiddleTheme"
+                android:tooltipText="@string/open_bookmarks_tooltip"
+                app:tooltipDensity="@dimen/tray_tooltip_density"
+                app:tooltipPosition="top"
                 android:src="@drawable/ic_icon_bookmarks"/>
 
             <org.mozilla.vrbrowser.ui.views.UIButton
                 android:id="@+id/settingsButton"
                 style="@style/trayButtonEndTheme"
+                android:tooltipText="@string/settings_tooltip"
+                app:tooltipDensity="@dimen/tray_tooltip_density"
+                app:tooltipPosition="top"
                 android:src="@drawable/ic_icon_settings"/>
         </LinearLayout>
 
diff --git a/app/src/main/res/values/attrs.xml b/app/src/main/res/values/attrs.xml
index a9e831577..c042640a9 100644
--- a/app/src/main/res/values/attrs.xml
+++ b/app/src/main/res/values/attrs.xml
@@ -20,9 +20,18 @@
         <attr name="activeModeTintColorList" format="reference|color" />
         <attr name="privateModeBackground" format="integer" />
         <attr name="activeModeBackground" format="integer" />
+        <attr name="tooltipDelay" />
+        <attr name="tooltipPosition" />
+        <attr name="tooltipDensity" />
     </declare-styleable>
 
     <attr name="description" format="string" />
+    <attr name="tooltipDelay" format="integer" />
+    <attr name="tooltipPosition" format="enum">
+        <enum name="top" value="0"/>
+        <enum name="bottom" value="1"/>
+    </attr>
+    <attr name="tooltipDensity" format="dimension" />
 
     <declare-styleable name="SwitchSetting">
         <attr name="description" />
diff --git a/app/src/main/res/values/colors.xml b/app/src/main/res/values/colors.xml
index 4fe175ae2..a4d267985 100644
--- a/app/src/main/res/values/colors.xml
+++ b/app/src/main/res/values/colors.xml
@@ -31,7 +31,9 @@
     <color name="iron">#5d5d5d</color>
     <color name="iron_blur">#805d5d5d</color>
     <color name="rhino">#8c898a</color>
+    <color name="rhino_blur">#808c898a</color>
     <color name="geranium">#d73e5a</color>
     <color name="text_shadow">#8F000000</color>
     <color name="text_shadow_light">#7FFFFFFF</color>
+    <color name="smoke">#f5f6fa</color>
 </resources>
diff --git a/app/src/main/res/values/dimen.xml b/app/src/main/res/values/dimen.xml
index 148d25e0c..7ff6b5e53 100644
--- a/app/src/main/res/values/dimen.xml
+++ b/app/src/main/res/values/dimen.xml
@@ -121,6 +121,7 @@
     <item name="tray_world_width" format="float" type="dimen">1.2</item>
     <dimen name="tray_width">165dp</dimen>
     <dimen name="tray_height">40dp</dimen>
+    <item name="tray_tooltip_density" format="float" type="dimen">4.0</item>
 
     <!-- Developer Options Panel -->
     <dimen name="developer_options_width">585dp</dimen>
@@ -187,4 +188,8 @@
     <!-- Blur -->
     <dimen name="blur_radius">2dp</dimen>
     <dimen name="blur_radius_half">1dp</dimen>
+
+    <!-- Tooltip -->
+    <item name="tooltip_z_distance" format="float" type="dimen">0.02</item>
+    <item name="tooltip_delay" format="integer" type="integer">1000</item>
 </resources>
\ No newline at end of file
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
index e14e3d6d5..d73c973e1 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -629,10 +629,22 @@
          speech-to-text recognition. -->
     <string name="voice_search_tooltip">Voice Search</string>
 
+    <!-- This string is for the tooltip that appears upon hovering the 'User Agent' button in the
+         browser's navigation bar. The button it labels, when pressed, change the currently used user agent. -->
+    <string name="user_agent_tooltip">User Agent</string>
+
     <!-- This string is for the tooltip that when clicking the 'Info' (ⓘ) icon visible next to the current website's
          URL in the URL bar. The button it labels, when pressed, shows information about the site. -->
     <string name="site_info_tooltip">Show site info.</string>
 
+    <!-- This string is for the tooltip that appears upon hovering the 'Servo' button in the browser's navigation bar.
+         'Servo' refers to the Servo engine. -->
+    <string name="servo_tooltip">Use Servo</string>
+
+    <!-- This string is for the tooltip that appears upon hovering the 'Resize' button in the browser's navigation bar.
+         'Resize' refers to the button used to resize the browset window. -->
+    <string name="resize_tooltip">Resize</string>
+
     <!-- This string is for the tooltip that appears when the user is not in the browser's Private Browsing mode
          and hovers over the 'Private Browsing' icon in the browser's tray menu. -->
     <string name="private_browsing_enter_tooltip">Enter Private Browsing</string>
@@ -644,11 +656,32 @@
     <!-- This string is shown in the context menu after a longpress on a link. When clicked it opens the target url in a new window. -->
     <string name="context_menu_open_new_window">Open in a new window.</string>
 
+    <!-- This string is for the tooltip that appears when the user hovers over the 'Bookmark' icon in the
+         browser's navigation bar. The button it labels, when pressed, bookmarks the currently open web site. -->
+    <string name="bookmark_tooltip">Bookmark this page</string>
+
     <!-- This string is for the tooltip that appears when the user hovers over the 'Bookmarks' icon in the
-         browser's navigation bar. The button it labels, when pressed, opens a list view of the user's saved
+         tray. The button it labels, when pressed, opens a list view of the user's saved
          Bookmarks. -->
     <string name="bookmarks_tooltip">Bookmarks</string>
 
+    <!-- This string is for the tooltip that appears when the user hovers over the 'Bookmarks' icon in the
+         tray and the Bookmarks view is closed. The button it labels, when pressed, opens a list view of the user's saved
+         Bookmarks. -->
+    <string name="open_bookmarks_tooltip">Open Bookmarks</string>
+
+    <!-- This string is for the tooltip that appears when the user hovers over the 'Bookmarks' icon in the
+         tray and the Bookmarks view is closed. The button it labels, when pressed, closes the Bookmarks view. -->
+    <string name="close_bookmarks_tooltip">Close Bookmarks</string>
+
+    <!-- This string is for the tooltip that appears when the user hovers over the 'Settings' icon in the
+         tray. The button it labels, when pressed, opens the Settings panel. -->
+    <string name="settings_tooltip">Settings</string>
+
+    <!-- This string is for the tooltip that appears when the user hovers over the 'New Window' icon in the
+         tray. The button it labels, when pressed, opens a new browser window. -->
+    <string name="new_window_tooltip">Open a New Window</string>
+
     <!-- This string is for the tooltip that appears when the user hovers over the down-arrow icon that appears in the
          URL bar upon hover. The icon it labels, when pressed, expands a list of recently visited websites in the
          user's History. -->

From 386c36327ea82d9b461e970db8ded30bb12841d0 Mon Sep 17 00:00:00 2001
From: Manuel Martin <manmartin@mozilla.com>
Date: Thu, 18 Jul 2019 13:07:03 +0200
Subject: [PATCH 2/3] Improved widget size calculation and layouting

---
 .../vrbrowser/ui/widgets/TooltipWidget.java   | 44 ++++++-------------
 1 file changed, 13 insertions(+), 31 deletions(-)

diff --git a/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/TooltipWidget.java b/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/TooltipWidget.java
index c4ff45b97..e30c19532 100644
--- a/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/TooltipWidget.java
+++ b/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/TooltipWidget.java
@@ -4,8 +4,6 @@
 import android.graphics.PointF;
 import android.graphics.Rect;
 import android.view.View;
-import android.view.ViewGroup;
-import android.view.ViewTreeObserver;
 import android.widget.TextView;
 
 import org.mozilla.vrbrowser.R;
@@ -18,8 +16,7 @@ public class TooltipWidget extends UIWidget {
     protected TextView mText;
     private PointF mTranslation;
     private float mRatio;
-    private int mPaddingH;
-    private int mPaddingV;
+    private float mDensityRatio;
 
     public TooltipWidget(Context aContext) {
         super(aContext);
@@ -31,10 +28,6 @@ private void initialize() {
         inflate(getContext(), R.layout.tooltip, this);
 
         mText = findViewById(R.id.tooltipText);
-
-        ViewGroup layout = findViewById(R.id.layout);
-        mPaddingH = layout.getPaddingStart() + layout.getPaddingEnd();
-        mPaddingV = layout.getPaddingTop() + layout.getPaddingBottom();
     }
 
     @Override
@@ -47,6 +40,7 @@ protected void initializeWidgetPlacement(WidgetPlacement aPlacement) {
         aPlacement.anchorX = 0.5f;
         aPlacement.anchorY = 0.5f;
         aPlacement.translationZ = WidgetPlacement.unitFromMeters(getContext(), R.dimen.tooltip_z_distance);
+//        aPlacement.textureScale = 1.0f;
     }
 
     @Override
@@ -55,22 +49,12 @@ public void show(@ShowFlags int aShowFlags) {
                 MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));
         mWidgetPlacement.translationX = mTranslation.x * (mRatio / mWidgetPlacement.density);
         mWidgetPlacement.translationY = mTranslation.y * (mRatio / mWidgetPlacement.density);
-        mWidgetPlacement.width = (int)((getMeasuredWidth() + mPaddingH)/mWidgetPlacement.density);
-        mWidgetPlacement.height = (int)((getMeasuredHeight() + mPaddingV)/mWidgetPlacement.density);
-        super.show(aShowFlags);
+        int paddingH = getPaddingStart() + getPaddingEnd();
+        int paddingV = getPaddingTop() + getPaddingBottom();
+        mWidgetPlacement.width = (int)(WidgetPlacement.convertPixelsToDp(getContext(), getMeasuredWidth() + paddingH)/mDensityRatio);
+        mWidgetPlacement.height = (int)(WidgetPlacement.convertPixelsToDp(getContext(), getMeasuredHeight() + paddingV)/mDensityRatio);
 
-        ViewTreeObserver viewTreeObserver = getViewTreeObserver();
-        if (viewTreeObserver.isAlive()) {
-            viewTreeObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
-                @Override
-                public void onGlobalLayout() {
-                    getViewTreeObserver().removeOnGlobalLayoutListener(this);
-                    mWidgetPlacement.width = (int)(getWidth() / mWidgetPlacement.density);
-                    mWidgetPlacement.height = (int)(getHeight() / mWidgetPlacement.density);
-                    mWidgetManager.updateWidget(TooltipWidget.this);
-                }
-            });
-        }
+        super.show(aShowFlags);
     }
 
     public void setLayoutParams(View targetView) {
@@ -86,6 +70,8 @@ public void setLayoutParams(View targetView, ViewUtils.TooltipPosition position,
         mParentWidget = ViewUtils.getParentWidget(mTargetView);
         if (mParentWidget != null) {
             mRatio = WidgetPlacement.worldToWidgetRatio(mParentWidget);
+            mWidgetPlacement.density = density;
+            mDensityRatio = mWidgetPlacement.density / getContext().getResources().getDisplayMetrics().density;
 
             Rect offsetViewBounds = new Rect();
             getDrawingRect(offsetViewBounds);
@@ -94,21 +80,17 @@ public void setLayoutParams(View targetView, ViewUtils.TooltipPosition position,
             mWidgetPlacement.parentHandle = mParentWidget.getHandle();
             // At the moment we only support showing tooltips on top or bottom of the target view
             if (position == ViewUtils.TooltipPosition.BOTTOM) {
-                mWidgetPlacement.density = density;
                 mWidgetPlacement.anchorY = 1.0f;
                 mWidgetPlacement.parentAnchorY = 0.0f;
-                float densityRatio = mWidgetPlacement.density / getContext().getResources().getDisplayMetrics().density;
                 mTranslation = new PointF(
-                        (offsetViewBounds.left + mTargetView.getWidth() / 2) * densityRatio,
-                        -offsetViewBounds.top * densityRatio);
+                        (offsetViewBounds.left + mTargetView.getWidth() / 2) * mDensityRatio,
+                        -offsetViewBounds.top * mDensityRatio);
             } else {
-                mWidgetPlacement.density = density;
                 mWidgetPlacement.anchorY = 0.0f;
                 mWidgetPlacement.parentAnchorY = 1.0f;
-                float densityRatio = mWidgetPlacement.density / getContext().getResources().getDisplayMetrics().density;
                 mTranslation = new PointF(
-                        (offsetViewBounds.left + mTargetView.getWidth() / 2) * densityRatio,
-                        offsetViewBounds.top * densityRatio);
+                        (offsetViewBounds.left + mTargetView.getWidth() / 2) * mDensityRatio,
+                        offsetViewBounds.top * mDensityRatio);
             }
         }
     }

From 5db590c916b5ddfaf3f2b48410a3d5064c552d18 Mon Sep 17 00:00:00 2001
From: Manuel Martin <manmartin@mozilla.com>
Date: Thu, 18 Jul 2019 13:08:37 +0200
Subject: [PATCH 3/3] Fixed visual issues

wip
---
 .../vrbrowser/ui/widgets/TooltipWidget.java   |  1 -
 .../main/res/drawable/tooltip_background.xml  | 21 +++++++++++++------
 app/src/main/res/layout/tooltip.xml           |  6 +++++-
 app/src/main/res/values/dimen.xml             |  1 +
 4 files changed, 21 insertions(+), 8 deletions(-)

diff --git a/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/TooltipWidget.java b/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/TooltipWidget.java
index e30c19532..b86f37a85 100644
--- a/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/TooltipWidget.java
+++ b/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/TooltipWidget.java
@@ -40,7 +40,6 @@ protected void initializeWidgetPlacement(WidgetPlacement aPlacement) {
         aPlacement.anchorX = 0.5f;
         aPlacement.anchorY = 0.5f;
         aPlacement.translationZ = WidgetPlacement.unitFromMeters(getContext(), R.dimen.tooltip_z_distance);
-//        aPlacement.textureScale = 1.0f;
     }
 
     @Override
diff --git a/app/src/main/res/drawable/tooltip_background.xml b/app/src/main/res/drawable/tooltip_background.xml
index 409baa5aa..85a6c45b6 100644
--- a/app/src/main/res/drawable/tooltip_background.xml
+++ b/app/src/main/res/drawable/tooltip_background.xml
@@ -1,7 +1,16 @@
 <?xml version="1.0" encoding="utf-8"?>
-<shape xmlns:android="http://schemas.android.com/apk/res/android"
-       android:shape="rectangle">
-    <corners android:radius="30dp" />
-    <stroke android:color="@color/rhino_blur" android:width="@dimen/blur_radius" />
-    <solid android:color="@color/rhino"/>
-</shape>
\ No newline at end of file
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+    <item>
+        <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
+            <corners android:radius="30dp" />
+            <stroke android:width="@dimen/blur_radius" android:color="@color/fog_blur" />
+        </shape>
+    </item>
+    <item android:start="@dimen/blur_radius_half" android:end="@dimen/blur_radius_half" android:top="@dimen/blur_radius_half" android:bottom="@dimen/blur_radius_half">
+        <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
+            <corners android:radius="30dp" />
+            <solid android:color="@color/rhino" />
+            <stroke android:width="2dp" android:color="@color/rhino_blur" />
+        </shape>
+    </item>
+</layer-list>
\ No newline at end of file
diff --git a/app/src/main/res/layout/tooltip.xml b/app/src/main/res/layout/tooltip.xml
index 654464db5..c014e9506 100644
--- a/app/src/main/res/layout/tooltip.xml
+++ b/app/src/main/res/layout/tooltip.xml
@@ -16,10 +16,14 @@
             android:layout_height="wrap_content"
             android:layout_gravity="center"
             android:gravity="center"
-            android:textSize="@dimen/text_biggest_size"
+            android:textSize="@dimen/text_huge_size"
             android:maxLines="1"
             android:singleLine="true"
             android:textColor="@color/smoke"
+            android:shadowColor="@color/asphalt_blur"
+            android:shadowDx="2.0"
+            android:shadowDy="2.0"
+            android:shadowRadius="0.5"
             tools:text="Text" />
     </FrameLayout>
 </merge>
\ No newline at end of file
diff --git a/app/src/main/res/values/dimen.xml b/app/src/main/res/values/dimen.xml
index 7ff6b5e53..a0cd6170b 100644
--- a/app/src/main/res/values/dimen.xml
+++ b/app/src/main/res/values/dimen.xml
@@ -165,6 +165,7 @@
     <dimen name="dialog_padding_sides">30dp</dimen>
 
     <!-- Text sizes -->
+    <dimen name="text_huge_size">28sp</dimen>
     <dimen name="text_biggest_size">24sp</dimen>
     <dimen name="text_bigger_size">22sp</dimen>
     <dimen name="text_big_size">18sp</dimen>