Change the layout of post. Add an error view when loading the preview image fails.

7 files changed, 319 insertions, 218 deletions

diff --git a/app/src/main/java/ml/docilealligator/infinityforreddit/PostRecyclerViewAdapter.java b/app/src/main/java/ml/docilealligator/infinityforreddit/PostRecyclerViewAdapter.java
index aeaa3ae0..d9b6c146 100644
--- a/app/src/main/java/ml/docilealligator/infinityforreddit/PostRecyclerViewAdapter.java
+++ b/app/src/main/java/ml/docilealligator/infinityforreddit/PostRecyclerViewAdapter.java
@@ -9,7 +9,6 @@ import android.support.annotation.NonNull;
 import android.support.annotation.Nullable;
 import android.support.customtabs.CustomTabsIntent;
 import android.support.v4.content.ContextCompat;
-import android.support.v7.widget.CardView;
 import android.support.v7.widget.RecyclerView;
 import android.util.Log;
 import android.view.LayoutInflater;
@@ -74,8 +73,8 @@ class PostRecyclerViewAdapter extends RecyclerView.Adapter<RecyclerView.ViewHold
     @Override
     public RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
         if(viewType == VIEW_TYPE_DATA) {
-            CardView cardView = (CardView) LayoutInflater.from(parent.getContext()).inflate(R.layout.item_post, parent, false);
-            return new DataViewHolder(cardView);
+            LinearLayout linearLayout = (LinearLayout) LayoutInflater.from(parent.getContext()).inflate(R.layout.item_post, parent, false);
+            return new DataViewHolder(linearLayout);
         } else {
             LinearLayout linearLayout = (LinearLayout) LayoutInflater.from(parent.getContext()).inflate(R.layout.item_footer_progress_bar, parent, false);
             return new LoadingViewHolder(linearLayout);
@@ -122,7 +121,7 @@ class PostRecyclerViewAdapter extends RecyclerView.Adapter<RecyclerView.ViewHold
                     glide.load(R.drawable.subreddit_default_icon).into(((DataViewHolder) holder).subredditIconCircleImageView);
                 }
 
-                ((DataViewHolder) holder).cardView.setOnClickListener(new View.OnClickListener() {
+                ((DataViewHolder) holder).linearLayout.setOnClickListener(new View.OnClickListener() {
                     @Override
                     public void onClick(View view) {
                         if(canStartActivity) {
@@ -199,27 +198,7 @@ class PostRecyclerViewAdapter extends RecyclerView.Adapter<RecyclerView.ViewHold
                     ((DataViewHolder) holder).relativeLayout.setVisibility(View.VISIBLE);
                     ((DataViewHolder) holder).progressBar.setVisibility(View.VISIBLE);
                     ((DataViewHolder) holder).imageView.setVisibility(View.VISIBLE);
-
-                    String previewUrl = mPostData.get(position).getPreviewUrl();
-                    RequestBuilder imageRequestBuilder = glide.load(previewUrl).listener(new RequestListener<Drawable>() {
-                        @Override
-                        public boolean onLoadFailed(@Nullable GlideException e, Object model, Target<Drawable> target, boolean isFirstResource) {
-                            return false;
-                        }
-
-                        @Override
-                        public boolean onResourceReady(Drawable resource, Object model, Target<Drawable> target, DataSource dataSource, boolean isFirstResource) {
-                            ((DataViewHolder) holder).progressBar.setVisibility(View.GONE);
-                            return false;
-                        }
-                    });
-
-                    if(mPostData.get(position).isNSFW()) {
-                        imageRequestBuilder.apply(RequestOptions.bitmapTransform(new BlurTransformation(25, 3)))
-                                .into(((DataViewHolder) holder).imageView);
-                    } else {
-                        imageRequestBuilder.into(((DataViewHolder) holder).imageView);
-                    }
+                    loadImage(holder, mPostData.get(holder.getAdapterPosition()));
                 }
 
                 if(mPostData.get(position).isStickied()) {
@@ -482,6 +461,38 @@ class PostRecyclerViewAdapter extends RecyclerView.Adapter<RecyclerView.ViewHold
         }
     }
 
+    private void loadImage(final RecyclerView.ViewHolder holder, final PostData postData) {
+        RequestBuilder imageRequestBuilder = glide.load(postData.getPreviewUrl()).listener(new RequestListener<Drawable>() {
+            @Override
+            public boolean onLoadFailed(@Nullable GlideException e, Object model, Target<Drawable> target, boolean isFirstResource) {
+                ((DataViewHolder) holder).progressBar.setVisibility(View.GONE);
+                ((DataViewHolder) holder).errorLinearLayout.setVisibility(View.VISIBLE);
+                ((DataViewHolder)holder).errorLinearLayout.setOnClickListener(new View.OnClickListener() {
+                    @Override
+                    public void onClick(View view) {
+                        ((DataViewHolder) holder).progressBar.setVisibility(View.VISIBLE);
+                        ((DataViewHolder) holder).errorLinearLayout.setVisibility(View.GONE);
+                        loadImage(holder, postData);
+                    }
+                });
+                return false;
+            }
+
+            @Override
+            public boolean onResourceReady(Drawable resource, Object model, Target<Drawable> target, DataSource dataSource, boolean isFirstResource) {
+                ((DataViewHolder) holder).errorLinearLayout.setVisibility(View.GONE);
+                ((DataViewHolder) holder).progressBar.setVisibility(View.GONE);
+                return false;
+            }
+        });
+
+        if(postData.isNSFW()) {
+            imageRequestBuilder.apply(RequestOptions.bitmapTransform(new BlurTransformation(25, 3)))
+                    .into(((DataViewHolder) holder).imageView);
+        } else {
+            imageRequestBuilder.into(((DataViewHolder) holder).imageView);
+        }
+    }
     @Override
     public int getItemCount() {
         if(mPostData == null || mPostData.isEmpty()) {
@@ -496,7 +507,7 @@ class PostRecyclerViewAdapter extends RecyclerView.Adapter<RecyclerView.ViewHold
     }
 
     class DataViewHolder extends RecyclerView.ViewHolder {
-        private CardView cardView;
+        private LinearLayout linearLayout;
         private CircleImageView subredditIconCircleImageView;
         private TextView subredditNameTextView;
         private ImageView stickiedPostImageView;
@@ -509,15 +520,16 @@ class PostRecyclerViewAdapter extends RecyclerView.Adapter<RecyclerView.ViewHold
         private RelativeLayout relativeLayout;
         private ProgressBar progressBar;
         private ImageView imageView;
+        private LinearLayout errorLinearLayout;
         private ImageView noPreviewLinkImageView;
         private ImageView upvoteButton;
         private TextView scoreTextView;
         private ImageView downvoteButton;
         private ImageView shareButton;
 
-        DataViewHolder(CardView itemView) {
+        DataViewHolder(LinearLayout itemView) {
             super(itemView);
-            cardView = itemView.findViewById(R.id.card_view_view_post_detail);
+            linearLayout = itemView.findViewById(R.id.linear_layout_view_post_detail);
             subredditIconCircleImageView = itemView.findViewById(R.id.subreddit_icon_circle_image_view_best_post_item);
             subredditNameTextView = itemView.findViewById(R.id.subreddit_text_view_best_post_item);
             stickiedPostImageView = itemView.findViewById(R.id.stickied_post_image_view_best_post_item);
@@ -530,6 +542,7 @@ class PostRecyclerViewAdapter extends RecyclerView.Adapter<RecyclerView.ViewHold
             relativeLayout = itemView.findViewById(R.id.image_view_wrapper_item_best_post);
             progressBar = itemView.findViewById(R.id.progress_bar_best_post_item);
             imageView = itemView.findViewById(R.id.image_view_best_post_item);
+            errorLinearLayout = itemView.findViewById(R.id.load_image_error_linear_layout_best_post_item);
             noPreviewLinkImageView = itemView.findViewById(R.id.image_view_no_preview_link_best_post_item);
 
             upvoteButton = itemView.findViewById(R.id.plus_button_item_best_post);
@@ -564,6 +577,7 @@ class PostRecyclerViewAdapter extends RecyclerView.Adapter<RecyclerView.ViewHold
             ((DataViewHolder) holder).nsfwTextView.setVisibility(View.GONE);
             ((DataViewHolder) holder).progressBar.setVisibility(View.GONE);
             ((DataViewHolder) holder).imageView.setVisibility(View.GONE);
+            ((DataViewHolder) holder).errorLinearLayout.setVisibility(View.GONE);
             ((DataViewHolder) holder).noPreviewLinkImageView.setVisibility(View.GONE);
             ((DataViewHolder) holder).upvoteButton.clearColorFilter();
             ((DataViewHolder) holder).downvoteButton.clearColorFilter();
diff --git a/app/src/main/java/ml/docilealligator/infinityforreddit/ViewPostDetailActivity.java b/app/src/main/java/ml/docilealligator/infinityforreddit/ViewPostDetailActivity.java
index 74776f31..d5f401d1 100644
--- a/app/src/main/java/ml/docilealligator/infinityforreddit/ViewPostDetailActivity.java
+++ b/app/src/main/java/ml/docilealligator/infinityforreddit/ViewPostDetailActivity.java
@@ -52,6 +52,10 @@ public class ViewPostDetailActivity extends AppCompatActivity {
     private PostData mPostData;
 
     private CoordinatorLayout mCoordinatorLayout;
+    private ProgressBar mLoadImageProgressBar;
+    private ImageView mImageView;
+    private RelativeLayout mLoadWrapper;
+    private TextView mLoadImageErrorTextView;
     private ProgressBar mCommentProgressbar;
     private CardView mCommentCardView;
     private MultiLevelRecyclerView mRecyclerView;
@@ -85,8 +89,10 @@ public class ViewPostDetailActivity extends AppCompatActivity {
         TextView gildedNumberTextView = findViewById(R.id.gilded_number_text_view_view_post_detail);
         TextView nsfwTextView = findViewById(R.id.nsfw_text_view_view_post_detail);
         RelativeLayout relativeLayout = findViewById(R.id.image_view_wrapper_view_post_detail);
-        final ProgressBar progressBar = findViewById(R.id.progress_bar_view_post_detail);
-        ImageView imageView = findViewById(R.id.image_view_view_post_detail);
+        mLoadWrapper = findViewById(R.id.load_wrapper_view_post_detail);
+        mLoadImageProgressBar = findViewById(R.id.progress_bar_view_post_detail);
+        mLoadImageErrorTextView = findViewById(R.id.load_image_error_text_view_view_post_detail);
+        mImageView = findViewById(R.id.image_view_view_post_detail);
         ImageView noPreviewLinkImageView = findViewById(R.id.image_view_no_preview_link_view_post_detail);
 
         final ImageView upvoteButton = findViewById(R.id.plus_button_view_post_detail);
@@ -151,12 +157,12 @@ public class ViewPostDetailActivity extends AppCompatActivity {
 
         if(mPostData.getPostType() != PostData.TEXT_TYPE && mPostData.getPostType() != PostData.NO_PREVIEW_LINK_TYPE) {
             relativeLayout.setVisibility(View.VISIBLE);
-            imageView.setVisibility(View.VISIBLE);
-
-            RequestBuilder imageRequestBuilder = Glide.with(this).load(mPostData.getPreviewUrl()).listener(new RequestListener<Drawable>() {
+            mImageView.setVisibility(View.VISIBLE);
+            loadImage();
+            /*RequestBuilder imageRequestBuilder = Glide.with(this).load(mPostData.getPreviewUrl()).listener(new RequestListener<Drawable>() {
                 @Override
                 public boolean onLoadFailed(@Nullable GlideException e, Object model, Target<Drawable> target, boolean isFirstResource) {
-                    //Need to be implemented
+                    progressBar.setVisibility(View.GONE);
                     return false;
                 }
 
@@ -169,10 +175,10 @@ public class ViewPostDetailActivity extends AppCompatActivity {
 
             if(mPostData.isNSFW()) {
                 imageRequestBuilder.apply(RequestOptions.bitmapTransform(new BlurTransformation(50, 3)))
-                        .into(imageView);
+                        .into(mImageView);
             } else {
-                imageRequestBuilder.into(imageView);
-            }
+                imageRequestBuilder.into(mImageView);
+            }*/
         }
 
         mRecyclerView.setNestedScrollingEnabled(false);
@@ -222,7 +228,7 @@ public class ViewPostDetailActivity extends AppCompatActivity {
         switch (mPostData.getPostType()) {
             case PostData.IMAGE_TYPE:
                 typeTextView.setText("IMAGE");
-                imageView.setOnClickListener(new View.OnClickListener() {
+                mImageView.setOnClickListener(new View.OnClickListener() {
                     @Override
                     public void onClick(View view) {
                         Intent intent = new Intent(ViewPostDetailActivity.this, ViewImageActivity.class);
@@ -241,7 +247,7 @@ public class ViewPostDetailActivity extends AppCompatActivity {
                     contentTextView.setHtml(mPostData.getSelfText());
                 }
 
-                imageView.setOnClickListener(new View.OnClickListener() {
+                mImageView.setOnClickListener(new View.OnClickListener() {
                     @Override
                     public void onClick(View view) {
                         CustomTabsIntent.Builder builder = new CustomTabsIntent.Builder();
@@ -257,7 +263,7 @@ public class ViewPostDetailActivity extends AppCompatActivity {
                 typeTextView.setText("VIDEO");
 
                 final Uri gifVideoUri = Uri.parse(mPostData.getVideoUrl());
-                imageView.setOnClickListener(new View.OnClickListener() {
+                mImageView.setOnClickListener(new View.OnClickListener() {
                     @Override
                     public void onClick(View view) {
                         Intent intent = new Intent(ViewPostDetailActivity.this, ViewVideoActivity.class);
@@ -278,7 +284,7 @@ public class ViewPostDetailActivity extends AppCompatActivity {
                 typeTextView.setText("VIDEO");
 
                 final Uri videoUri = Uri.parse(mPostData.getVideoUrl());
-                imageView.setOnClickListener(new View.OnClickListener() {
+                mImageView.setOnClickListener(new View.OnClickListener() {
                     @Override
                     public void onClick(View view) {
                         Intent intent = new Intent(ViewPostDetailActivity.this, ViewVideoActivity.class);
@@ -524,6 +530,38 @@ public class ViewPostDetailActivity extends AppCompatActivity {
                 });
     }
 
+    private void loadImage() {
+        RequestBuilder imageRequestBuilder = Glide.with(this).load(mPostData.getPreviewUrl()).listener(new RequestListener<Drawable>() {
+            @Override
+            public boolean onLoadFailed(@Nullable GlideException e, Object model, Target<Drawable> target, boolean isFirstResource) {
+                mLoadImageProgressBar.setVisibility(View.GONE);
+                mLoadImageErrorTextView.setVisibility(View.VISIBLE);
+                mLoadImageErrorTextView.setOnClickListener(new View.OnClickListener() {
+                    @Override
+                    public void onClick(View view) {
+                        mLoadImageProgressBar.setVisibility(View.VISIBLE);
+                        mLoadImageErrorTextView.setVisibility(View.GONE);
+                        loadImage();
+                    }
+                });
+                return false;
+            }
+
+            @Override
+            public boolean onResourceReady(Drawable resource, Object model, Target<Drawable> target, DataSource dataSource, boolean isFirstResource) {
+                mLoadWrapper.setVisibility(View.GONE);
+                return false;
+            }
+        });
+
+        if(mPostData.isNSFW()) {
+            imageRequestBuilder.apply(RequestOptions.bitmapTransform(new BlurTransformation(50, 3)))
+                    .into(mImageView);
+        } else {
+            imageRequestBuilder.into(mImageView);
+        }
+    }
+
     private void showRetrySnackbar() {
         Snackbar snackbar = Snackbar.make(mCoordinatorLayout, R.string.load_comment_failed, Snackbar.LENGTH_INDEFINITE);
         snackbar.setAction(R.string.retry, new View.OnClickListener() {
diff --git a/app/src/main/res/drawable/ic_error_outline_black_24dp.xml b/app/src/main/res/drawable/ic_error_outline_black_24dp.xml
new file mode 100644
index 00000000..a07a0f90
--- /dev/null
+++ b/app/src/main/res/drawable/ic_error_outline_black_24dp.xml
@@ -0,0 +1,9 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+        android:width="24dp"
+        android:height="24dp"
+        android:viewportWidth="24.0"
+        android:viewportHeight="24.0">
+    <path
+        android:fillColor="#FF000000"
+        android:pathData="M11,15h2v2h-2zM11,7h2v6h-2zM11.99,2C6.47,2 2,6.48 2,12s4.47,10 9.99,10C17.52,22 22,17.52 22,12S17.52,2 11.99,2zM12,20c-4.42,0 -8,-3.58 -8,-8s3.58,-8 8,-8 8,3.58 8,8 -3.58,8 -8,8z"/>
+</vector>
diff --git a/app/src/main/res/layout/activity_view_post_detail.xml b/app/src/main/res/layout/activity_view_post_detail.xml
index c3a1c688..025f8ef1 100644
--- a/app/src/main/res/layout/activity_view_post_detail.xml
+++ b/app/src/main/res/layout/activity_view_post_detail.xml
@@ -144,12 +144,6 @@
                         android:layout_marginTop="16dp"
                         android:visibility="gone">
 
-                        <ProgressBar
-                            android:id="@+id/progress_bar_view_post_detail"
-                            android:layout_width="wrap_content"
-                            android:layout_height="wrap_content"
-                            android:layout_centerInParent="true" />
-
                         <ImageView
                             android:id="@+id/image_view_view_post_detail"
                             android:layout_width="match_parent"
@@ -157,6 +151,29 @@
                             android:adjustViewBounds="true"
                             android:scaleType="fitStart"/>
 
+                        <RelativeLayout
+                            android:id="@+id/load_wrapper_view_post_detail"
+                            android:layout_width="match_parent"
+                            android:layout_height="100dp">
+
+                            <ProgressBar
+                                android:id="@+id/progress_bar_view_post_detail"
+                                android:layout_width="wrap_content"
+                                android:layout_height="wrap_content"
+                                android:layout_centerInParent="true" />
+
+                            <TextView
+                                android:id="@+id/load_image_error_text_view_view_post_detail"
+                                android:layout_width="match_parent"
+                                android:layout_height="wrap_content"
+                                android:drawableTop="@drawable/ic_error_outline_black_24dp"
+                                android:layout_centerInParent="true"
+                                android:gravity="center"
+                                android:text="@string/tap_to_retry"
+                                android:visibility="gone" />
+
+                        </RelativeLayout>
+
                     </RelativeLayout>
 
                     <ImageView
diff --git a/app/src/main/res/layout/item_footer_progress_bar.xml b/app/src/main/res/layout/item_footer_progress_bar.xml
index 86e1a1a9..a84af3bc 100644
--- a/app/src/main/res/layout/item_footer_progress_bar.xml
+++ b/app/src/main/res/layout/item_footer_progress_bar.xml
@@ -10,7 +10,7 @@
         android:id="@+id/progress_bar_footer_progress_bar_item"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
-        android:layout_marginTop="8dp"
+        android:layout_marginTop="16dp"
         android:layout_marginBottom="16dp"
         android:layout_gravity="center" />
 
@@ -18,7 +18,7 @@
         android:id="@+id/relative_layout_footer_progress_bar_item"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:layout_marginTop="8dp"
+        android:layout_marginTop="16dp"
         android:layout_marginBottom="16dp"
         android:layout_marginLeft="16dp"
         android:layout_marginStart="16dp"
@@ -41,6 +41,7 @@
             android:layout_height="wrap_content"
             android:layout_alignParentEnd="true"
             android:layout_centerVertical="true"
+            android:background="@color/colorAccent"
             android:text="@string/retry" />
 
     </RelativeLayout>
diff --git a/app/src/main/res/layout/item_post.xml b/app/src/main/res/layout/item_post.xml
index 78a55cf2..c34ee582 100644
--- a/app/src/main/res/layout/item_post.xml
+++ b/app/src/main/res/layout/item_post.xml
@@ -1,208 +1,229 @@
 <?xml version="1.0" encoding="utf-8"?>
+<!--
 <android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:layout_marginTop="8dp"
     android:layout_marginBottom="8dp"
     android:id="@+id/card_view_view_post_detail">
+</android.support.v7.widget.CardView>-->
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:orientation="vertical"
+    android:id="@+id/linear_layout_view_post_detail">
 
-    <LinearLayout
+    <RelativeLayout
+        android:id="@+id/relative_view_item_best_post"
         android:layout_width="match_parent"
-        android:layout_height="match_parent"
-        android:orientation="vertical">
+        android:layout_height="wrap_content"
+        android:layout_marginBottom="8dp"
+        android:layout_marginLeft="16dp"
+        android:layout_marginStart="16dp"
+        android:layout_marginRight="16dp"
+        android:layout_marginEnd="16dp"
+        android:layout_marginTop="16dp">
+
+        <de.hdodenhof.circleimageview.CircleImageView
+            android:id="@+id/subreddit_icon_circle_image_view_best_post_item"
+            android:layout_width="24dp"
+            android:layout_height="24dp"
+            android:layout_alignParentStart="true"
+            android:layout_centerVertical="true"/>
 
-        <RelativeLayout
-            android:id="@+id/relative_view_item_best_post"
-            android:layout_width="match_parent"
+        <TextView
+            android:id="@+id/subreddit_text_view_best_post_item"
+            android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_marginBottom="8dp"
-            android:layout_marginLeft="16dp"
             android:layout_marginStart="16dp"
-            android:layout_marginRight="16dp"
-            android:layout_marginEnd="16dp"
-            android:layout_marginTop="16dp">
+            android:layout_toStartOf="@id/stickied_post_image_view_best_post_item"
+            android:layout_toEndOf="@id/subreddit_icon_circle_image_view_best_post_item"
+            android:layout_centerVertical="true"
+            android:textColor="#E91E63"/>
 
-            <de.hdodenhof.circleimageview.CircleImageView
-                android:id="@+id/subreddit_icon_circle_image_view_best_post_item"
-                android:layout_width="24dp"
-                android:layout_height="24dp"
-                android:layout_alignParentStart="true"
-                android:layout_centerVertical="true"/>
+        <ImageView
+            android:id="@+id/stickied_post_image_view_best_post_item"
+            android:layout_width="24dp"
+            android:layout_height="24dp"
+            android:layout_toStartOf="@id/post_time_text_view_best_post_item"
+            android:layout_marginStart="8dp"
+            android:layout_marginEnd="8dp"
+            android:tint="@color/colorPrimary"/>
 
-            <TextView
-                android:id="@+id/subreddit_text_view_best_post_item"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginStart="16dp"
-                android:layout_toStartOf="@id/stickied_post_image_view_best_post_item"
-                android:layout_toEndOf="@id/subreddit_icon_circle_image_view_best_post_item"
-                android:layout_centerVertical="true"
-                android:textColor="#E91E63"/>
-
-            <ImageView
-                android:id="@+id/stickied_post_image_view_best_post_item"
-                android:layout_width="24dp"
-                android:layout_height="24dp"
-                android:layout_toStartOf="@id/post_time_text_view_best_post_item"
-                android:layout_marginStart="8dp"
-                android:layout_marginEnd="8dp"
-                android:tint="@color/colorPrimary"/>
+        <TextView
+            android:id="@+id/post_time_text_view_best_post_item"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_alignParentEnd="true"
+            android:layout_centerVertical="true"/>
 
-            <TextView
-                android:id="@+id/post_time_text_view_best_post_item"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_alignParentEnd="true"
-                android:layout_centerVertical="true"/>
+    </RelativeLayout>
 
-        </RelativeLayout>
+    <TextView
+        android:id="@+id/title_text_view_best_post_item"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:layout_marginLeft="16dp"
+        android:layout_marginStart="16dp"
+        android:layout_marginRight="16dp"
+        android:layout_marginEnd="16dp"
+        android:textSize="18sp"
+        android:textColor="#000000"/>
+
+    <RelativeLayout
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="8dp"
+        android:layout_marginStart="16dp"
+        android:layout_marginEnd="16dp">
 
         <TextView
-            android:id="@+id/title_text_view_best_post_item"
-            android:layout_width="match_parent"
+            android:id="@+id/type_text_view_item_best_post"
+            android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_marginLeft="16dp"
-            android:layout_marginStart="16dp"
-            android:layout_marginRight="16dp"
+            android:background="@drawable/rounded_corner"
             android:layout_marginEnd="16dp"
-            android:textSize="18sp"
-            android:textColor="#000000"/>
+            android:layout_centerVertical="true"
+            android:textColor="@android:color/white"/>
 
-        <RelativeLayout
-            android:layout_width="match_parent"
+        <ImageView
+            android:id="@+id/gilded_image_view_item_best_post"
+            android:layout_width="24dp"
+            android:layout_height="24dp"
+            android:layout_toEndOf="@id/type_text_view_item_best_post"
+            android:layout_centerVertical="true"
+            android:visibility="gone"/>
+
+        <TextView
+            android:id="@+id/gilded_number_text_view_item_best_post"
+            android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_marginTop="8dp"
-            android:layout_marginStart="16dp"
-            android:layout_marginEnd="16dp">
+            android:layout_marginStart="4dp"
+            android:layout_marginEnd="8dp"
+            android:layout_toEndOf="@id/gilded_image_view_item_best_post"
+            android:layout_toStartOf="@id/nsfw_text_view_item_best_post"
+            android:layout_centerVertical="true"
+            android:visibility="gone"
+            android:textSize="20sp"
+            android:textColor="@color/gold"/>
 
-            <TextView
-                android:id="@+id/type_text_view_item_best_post"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:background="@drawable/rounded_corner"
-                android:layout_marginEnd="16dp"
-                android:layout_centerVertical="true"
-                android:textColor="@android:color/white"/>
-
-            <ImageView
-                android:id="@+id/gilded_image_view_item_best_post"
-                android:layout_width="24dp"
-                android:layout_height="24dp"
-                android:layout_toEndOf="@id/type_text_view_item_best_post"
-                android:layout_centerVertical="true"
-                android:visibility="gone"/>
+        <TextView
+            android:id="@+id/nsfw_text_view_item_best_post"
+            android:text="@string/nsfw"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:background="@drawable/nsfw_rounded_corner"
+            android:layout_alignParentEnd="true"
+            android:layout_marginStart="8dp"
+            android:layout_centerVertical="true"
+            android:textColor="@android:color/white"
+            android:visibility="gone"/>
 
-            <TextView
-                android:id="@+id/gilded_number_text_view_item_best_post"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginStart="4dp"
-                android:layout_marginEnd="8dp"
-                android:layout_toEndOf="@id/gilded_image_view_item_best_post"
-                android:layout_toStartOf="@id/nsfw_text_view_item_best_post"
-                android:layout_centerVertical="true"
-                android:visibility="gone"
-                android:textSize="20sp"
-                android:textColor="@color/gold"/>
+    </RelativeLayout>
 
-            <TextView
-                android:id="@+id/nsfw_text_view_item_best_post"
-                android:text="@string/nsfw"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:background="@drawable/nsfw_rounded_corner"
-                android:layout_alignParentEnd="true"
-                android:layout_marginStart="8dp"
-                android:layout_centerVertical="true"
-                android:textColor="@android:color/white"
-                android:visibility="gone"/>
+    <RelativeLayout
+        android:id="@+id/image_view_wrapper_item_best_post"
+        android:layout_width="match_parent"
+        android:layout_height="350dp"
+        android:layout_marginTop="16dp"
+        android:visibility="gone">
 
-        </RelativeLayout>
+        <ProgressBar
+            android:id="@+id/progress_bar_best_post_item"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_centerInParent="true" />
 
-        <RelativeLayout
-            android:id="@+id/image_view_wrapper_item_best_post"
+        <ImageView
+            android:id="@+id/image_view_best_post_item"
             android:layout_width="match_parent"
-            android:layout_height="350dp"
-            android:layout_marginTop="16dp"
-            android:visibility="gone">
+            android:layout_height="match_parent"
+            android:scaleType="centerCrop" />
 
-            <ProgressBar
-                android:id="@+id/progress_bar_best_post_item"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_centerInParent="true" />
+        <LinearLayout
+            android:id="@+id/load_image_error_linear_layout_best_post_item"
+            android:layout_width="match_parent"
+            android:layout_height="match_parent"
+            android:visibility="gone">
 
-            <ImageView
-                android:id="@+id/image_view_best_post_item"
+            <TextView
                 android:layout_width="match_parent"
-                android:layout_height="match_parent"
-                android:scaleType="centerCrop" />
+                android:layout_height="wrap_content"
+                android:drawableTop="@drawable/ic_error_outline_black_24dp"
+                android:layout_gravity="center"
+                android:gravity="center"
+                android:text="@string/tap_to_retry" />
 
-        </RelativeLayout>
+        </LinearLayout>
 
-        <ImageView
-            android:id="@+id/image_view_no_preview_link_best_post_item"
-            android:layout_width="match_parent"
-            android:layout_height="150dp"
-            android:layout_marginTop="16dp"
-            android:scaleType="center"
-            android:src="@drawable/ic_link"
-            android:background="#E0E0E0"
-            android:visibility="gone"/>
+    </RelativeLayout>
 
-        <RelativeLayout
-            android:layout_width="match_parent"
-            android:layout_height="wrap_content">
-
-            <ImageView
-                android:id="@+id/plus_button_item_best_post"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_alignParentStart="true"
-                android:padding="16dp"
-                android:src="@drawable/ic_arrow_upward_black_24dp"
-                android:layout_centerVertical="true"
-                android:tint="@android:color/tab_indicator_text"
-                android:background="?actionBarItemBackground"
-                android:clickable="true"
-                android:focusable="true"/>
+    <ImageView
+        android:id="@+id/image_view_no_preview_link_best_post_item"
+        android:layout_width="match_parent"
+        android:layout_height="150dp"
+        android:layout_marginTop="16dp"
+        android:scaleType="center"
+        android:src="@drawable/ic_link"
+        android:background="#E0E0E0"
+        android:visibility="gone"/>
+
+    <RelativeLayout
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content">
 
-            <TextView
-                android:id="@+id/score_text_view_item_best_post"
-                android:layout_width="64dp"
-                android:layout_height="wrap_content"
-                android:layout_centerVertical="true"
-                android:layout_toEndOf="@id/plus_button_item_best_post"
-                android:gravity="center"/>
+        <ImageView
+            android:id="@+id/plus_button_item_best_post"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_alignParentStart="true"
+            android:padding="16dp"
+            android:src="@drawable/ic_arrow_upward_black_24dp"
+            android:layout_centerVertical="true"
+            android:tint="@android:color/tab_indicator_text"
+            android:background="?actionBarItemBackground"
+            android:clickable="true"
+            android:focusable="true"/>
 
-            <ImageView
-                android:id="@+id/minus_button_item_best_post"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_centerVertical="true"
-                android:layout_toEndOf="@id/score_text_view_item_best_post"
-                android:padding="16dp"
-                android:src="@drawable/ic_arrow_downward_black_24dp"
-                android:tint="@android:color/tab_indicator_text"
-                android:background="?actionBarItemBackground"
-                android:clickable="true"
-                android:focusable="true"/>
-
-            <ImageView
-                android:id="@+id/share_button_item_best_post"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_alignParentEnd="true"
-                android:layout_centerVertical="true"
-                android:padding="16dp"
-                android:src="@drawable/ic_share_black_24dp"
-                android:tint="@android:color/tab_indicator_text"
-                android:background="?actionBarItemBackground"
-                android:clickable="true"
-                android:focusable="true" />
+        <TextView
+            android:id="@+id/score_text_view_item_best_post"
+            android:layout_width="64dp"
+            android:layout_height="wrap_content"
+            android:layout_centerVertical="true"
+            android:layout_toEndOf="@id/plus_button_item_best_post"
+            android:gravity="center"/>
 
-        </RelativeLayout>
+        <ImageView
+            android:id="@+id/minus_button_item_best_post"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_centerVertical="true"
+            android:layout_toEndOf="@id/score_text_view_item_best_post"
+            android:padding="16dp"
+            android:src="@drawable/ic_arrow_downward_black_24dp"
+            android:tint="@android:color/tab_indicator_text"
+            android:background="?actionBarItemBackground"
+            android:clickable="true"
+            android:focusable="true"/>
 
-    </LinearLayout>
+        <ImageView
+            android:id="@+id/share_button_item_best_post"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_alignParentEnd="true"
+            android:layout_centerVertical="true"
+            android:padding="16dp"
+            android:src="@drawable/ic_share_black_24dp"
+            android:tint="@android:color/tab_indicator_text"
+            android:background="?actionBarItemBackground"
+            android:clickable="true"
+            android:focusable="true" />
+
+    </RelativeLayout>
+
+    <View
+        android:layout_width="match_parent"
+        android:layout_height="1dp"
+        android:background="#E0E0E0"/>
 
-</android.support.v7.widget.CardView>
\ No newline at end of file
+</LinearLayout>
\ 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 3616ff91..325f4684 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -9,6 +9,7 @@
     <string name="action_download">Download</string>
     <string name="action_refresh">Refresh</string>
 
+    <string name="tap_to_retry">Error loading image. Tap to retry.</string>
     <string name="load_posts_error">Error loading posts.\nTap to retry.</string>
 
     <string name="load_data_failed">Cannot load posts</string>