path: root/WordPress/src/main/java/org/wordpress/android/widgets/WPNetworkImageView.java

package org.wordpress.android.widgets;

import android.animation.ObjectAnimator;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Color;
import android.graphics.drawable.ColorDrawable;
import android.os.AsyncTask;
import android.support.annotation.ColorRes;
import android.support.annotation.DrawableRes;
import android.support.v4.content.ContextCompat;
import android.support.v7.widget.AppCompatImageView;
import android.text.TextUtils;
import android.util.AttributeSet;
import android.view.View;
import android.view.ViewGroup.LayoutParams;

import com.android.volley.VolleyError;
import com.android.volley.toolbox.ImageLoader;

import org.wordpress.android.R;
import org.wordpress.android.WordPress;
import org.wordpress.android.datasets.ReaderThumbnailTable;
import org.wordpress.android.ui.reader.utils.ReaderVideoUtils;
import org.wordpress.android.util.AppLog;
import org.wordpress.android.util.DisplayUtils;
import org.wordpress.android.util.ImageUtils;
import org.wordpress.android.util.MediaUtils;
import org.wordpress.android.util.VolleyUtils;

import java.util.HashSet;

/**
 * most of the code below is from Volley's NetworkImageView, but it's modified to support:
 *  (1) fading in downloaded images
 *  (2) manipulating images before display
 *  (3) automatically retrieving the thumbnail for YouTube & Vimeo videos
 */
public class WPNetworkImageView extends AppCompatImageView {
    public enum ImageType {
        NONE,
        PHOTO,
        PHOTO_ROUNDED,
        VIDEO,
        AVATAR,
        BLAVATAR,
        GONE_UNTIL_AVAILABLE,
    }

    public interface ImageLoadListener {
        void onLoaded();
        void onError();
    }

    private ImageType mImageType = ImageType.NONE;
    private String mUrl;
    private ImageLoader.ImageContainer mImageContainer;

    private int mDefaultImageResId;
    private int mErrorImageResId;

    private static final HashSet<String> mUrlSkipList = new HashSet<>();

    public WPNetworkImageView(Context context) {
        super(context);
    }
    public WPNetworkImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }
    public WPNetworkImageView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    public void setImageUrl(String url, ImageType imageType) {
        setImageUrl(url, imageType, null);
    }

    public void setImageUrl(String url, ImageType imageType, ImageLoadListener imageLoadListener) {
        mUrl = url;
        mImageType = imageType;

        // The URL has potentially changed. See if we need to load it.
        loadImageIfNecessary(false, imageLoadListener);
    }

    /*
     * determine whether we can show a thumbnail image for the passed video - currently
     * we support YouTube, Vimeo & standard images
     */
    public static boolean canShowVideoThumbnail(String videoUrl) {
        return ReaderVideoUtils.isVimeoLink(videoUrl)
                || ReaderVideoUtils.isYouTubeVideoLink(videoUrl)
                || MediaUtils.isValidImage(videoUrl);
    }

    /*
     * retrieves and displays the thumbnail for the passed video
     */
    public void setVideoUrl(final long postId, final String videoUrl) {
        mImageType = ImageType.VIDEO;

        if (TextUtils.isEmpty(videoUrl)) {
            showErrorImage();
            return;
        }

        // if this is a YouTube video we can determine the thumbnail url from the passed url,
        // otherwise check if we've already cached the thumbnail url for this video
        String thumbnailUrl;
        if (ReaderVideoUtils.isYouTubeVideoLink(videoUrl)) {
            thumbnailUrl = ReaderVideoUtils.getYouTubeThumbnailUrl(videoUrl);
        } else {
            thumbnailUrl = ReaderThumbnailTable.getThumbnailUrl(videoUrl);
        }
        if (!TextUtils.isEmpty(thumbnailUrl)) {
            setImageUrl(thumbnailUrl, ImageType.VIDEO);
            return;
        }

        if (MediaUtils.isValidImage(videoUrl)) {
            setImageUrl(videoUrl, ImageType.VIDEO);
        } else if (ReaderVideoUtils.isVimeoLink(videoUrl)) {
            // vimeo videos require network request to get thumbnail
            showDefaultImage();
            ReaderVideoUtils.requestVimeoThumbnail(videoUrl, new ReaderVideoUtils.VideoThumbnailListener() {
                @Override
                public void onResponse(boolean successful, String thumbnailUrl) {
                    if (successful) {
                        ReaderThumbnailTable.addThumbnail(postId, videoUrl, thumbnailUrl);
                        setImageUrl(thumbnailUrl, ImageType.VIDEO);
                    }
                }
            });
        } else {
            AppLog.d(AppLog.T.UTILS, "no video thumbnail for " + videoUrl);
            showErrorImage();
        }
    }

    /**
     * Loads the image for the view if it isn't already loaded.
     * @param isInLayoutPass True if this was invoked from a layout pass, false otherwise.
     */
    private void loadImageIfNecessary(final boolean isInLayoutPass, final ImageLoadListener imageLoadListener) {
        // do nothing if image type hasn't been set yet
        if (mImageType == ImageType.NONE) {
            return;
        }

        int width = getWidth();
        int height = getHeight();
        ScaleType scaleType = getScaleType();

        boolean wrapWidth = false, wrapHeight = false;
        if (getLayoutParams() != null) {
            wrapWidth = getLayoutParams().width == LayoutParams.WRAP_CONTENT;
            wrapHeight = getLayoutParams().height == LayoutParams.WRAP_CONTENT;
        }

        // if the view's bounds aren't known yet, and this is not a wrap-content/wrap-content
        // view, hold off on loading the image.
        boolean isFullyWrapContent = wrapWidth && wrapHeight;
        if (width == 0 && height == 0 && !isFullyWrapContent && mImageType != ImageType.GONE_UNTIL_AVAILABLE) {
            return;
        }

        // if the URL to be loaded in this view is empty, cancel any old requests and clear the
        // currently loaded image.
        if (TextUtils.isEmpty(mUrl)) {
            if (mImageContainer != null) {
                mImageContainer.cancelRequest();
                mImageContainer = null;
            }
            showErrorImage();
            return;
        }

        // if there was an old request in this view, check if it needs to be canceled.
        if (mImageContainer != null && mImageContainer.getRequestUrl() != null) {
            if (mImageContainer.getRequestUrl().equals(mUrl)) {
                // if the request is from the same URL and it's not GONE_UNTIL_AVAILABLE, return.
                if (mImageType != ImageType.GONE_UNTIL_AVAILABLE) {
                    // GONE_UNTIL_AVAILABLE image type will make a new request if the previous response wasn't a 404 response,
                    // Volley usually returns it from cache.
                    return;
                }
            } else {
                // if there is a pre-existing request, cancel it if it's fetching a different URL.
                mImageContainer.cancelRequest();
                showDefaultImage();
            }
        }

        // skip this URL if a previous request for it returned a 404
        if (mUrlSkipList.contains(mUrl)) {
            AppLog.d(AppLog.T.UTILS, "skipping image request " + mUrl);
            showErrorImage();
            return;
        }

        // Calculate the max image width / height to use while ignoring WRAP_CONTENT dimens.
        int maxWidth = wrapWidth ? 0 : width;
        int maxHeight = wrapHeight ? 0 : height;

        // The pre-existing content of this view didn't match the current URL. Load the new image
        // from the network.
        ImageLoader.ImageContainer newContainer = WordPress.imageLoader.get(mUrl,
                new ImageLoader.ImageListener() {
                    @Override
                    public void onErrorResponse(VolleyError error) {
                        showErrorImage();
                        // keep track of URLs that 404 so we can skip them the next time
                        int statusCode = VolleyUtils.statusCodeFromVolleyError(error);
                        if (statusCode == 404) {
                            mUrlSkipList.add(mUrl);
                        }

                        if (imageLoadListener != null) {
                            imageLoadListener.onError();
                        }
                    }

                    @Override
                    public void onResponse(final ImageLoader.ImageContainer response, boolean isImmediate) {
                        // If this was an immediate response that was delivered inside of a layout
                        // pass do not set the image immediately as it will trigger a requestLayout
                        // inside of a layout. Instead, defer setting the image by posting back to
                        // the main thread.
                        if (isImmediate && isInLayoutPass) {
                            post(new Runnable() {
                                @Override
                                public void run() {
                                    handleResponse(response, true, imageLoadListener);
                                }
                            });
                        } else {
                            handleResponse(response, isImmediate, imageLoadListener);
                        }
                    }
                }, maxWidth, maxHeight, scaleType);

        // update the ImageContainer to be the new bitmap container.
        mImageContainer = newContainer;
    }

    private static boolean canFadeInImageType(ImageType imageType) {
        return imageType == ImageType.PHOTO
            || imageType == ImageType.VIDEO;
    }

    private void handleResponse(ImageLoader.ImageContainer response, boolean isCached, ImageLoadListener
            imageLoadListener) {
        if (response.getBitmap() != null) {
            Bitmap bitmap = response.getBitmap();

            if (mImageType == ImageType.GONE_UNTIL_AVAILABLE) {
                setVisibility(View.VISIBLE);
            }

            // Apply circular rounding to avatars in a background task
            if (mImageType == ImageType.AVATAR) {
                new ShapeBitmapTask(ShapeType.CIRCLE, imageLoadListener).executeOnExecutor(AsyncTask.THREAD_POOL_EXECUTOR, bitmap);
                return;
            } else if (mImageType == ImageType.PHOTO_ROUNDED) {
                new ShapeBitmapTask(ShapeType.ROUNDED, imageLoadListener).executeOnExecutor(AsyncTask.THREAD_POOL_EXECUTOR, bitmap);
                return;
            }

            setImageBitmap(bitmap);

            // fade in photos/videos if not cached (not used for other image types since animation can be expensive)
            if (!isCached && canFadeInImageType(mImageType)) {
                fadeIn();
            }
        } else {
            showDefaultImage();
        }
    }

    public void invalidateImage() {
        mUrlSkipList.clear();

        if (mImageContainer != null) {
            // If the view was bound to an image request, cancel it and clear
            // out the image from the view.
            mImageContainer.cancelRequest();
            setImageBitmap(null);
            // also clear out the container so we can reload the image if necessary.
            mImageContainer = null;
        }
    }

    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right, bottom);
        if (!isInEditMode()) {
            loadImageIfNecessary(true, null);
        }
    }

    @Override
    protected void onDetachedFromWindow() {
        invalidateImage();

        super.onDetachedFromWindow();
    }

    @Override
    protected void drawableStateChanged() {
        super.drawableStateChanged();
        invalidate();
    }

    private int getColorRes(@ColorRes int resId) {
        return ContextCompat.getColor(getContext(), resId);
    }

    public void setDefaultImageResId(@DrawableRes int resourceId) {
        mDefaultImageResId = resourceId;
    }

    public void setErrorImageResId(@DrawableRes int resourceId) {
        mErrorImageResId = resourceId;
    }

    public void showDefaultImage() {
        // use default image resource if one was supplied...
        if (mDefaultImageResId != 0) {
            setImageResource(mDefaultImageResId);
            return;
        }

        // ... otherwise use built-in default
        switch (mImageType) {
            case GONE_UNTIL_AVAILABLE:
                this.setVisibility(View.GONE);
                break;
            case NONE:
                // do nothing
                break;
            case AVATAR:
                // Grey circle for avatars
                setImageResource(R.drawable.shape_oval_grey_light);
                break;
            default :
                // light grey box for all others
                setImageDrawable(new ColorDrawable(getColorRes(R.color.grey_light)));
                break;
        }
    }

    private void showErrorImage() {
        if (mErrorImageResId != 0) {
            setImageResource(mErrorImageResId);
            return;
        }

        switch (mImageType) {
            case GONE_UNTIL_AVAILABLE:
                this.setVisibility(View.GONE);
                break;
            case NONE:
                // do nothing
                break;
            case AVATAR:
                // circular "mystery man" for failed avatars
                showDefaultGravatarImage();
                break;
            case BLAVATAR:
                showDefaultBlavatarImage();
                break;
            default :
                // grey box for all others
                setImageDrawable(new ColorDrawable(getColorRes(R.color.grey_lighten_30)));
                break;
        }
    }

    public void showDefaultGravatarImage() {
        if (getContext() == null) return;
        new ShapeBitmapTask(ShapeType.CIRCLE, null).executeOnExecutor(AsyncTask.THREAD_POOL_EXECUTOR, BitmapFactory.decodeResource(
                getContext().getResources(),
                R.drawable.gravatar_placeholder
        ));
    }

    public void showDefaultBlavatarImage() {
        setImageResource(R.drawable.blavatar_placeholder);
    }

    // --------------------------------------------------------------------------------------------------


    private static final int FADE_TRANSITION = 250;

    private void fadeIn() {
        ObjectAnimator alpha = ObjectAnimator.ofFloat(this, View.ALPHA, 0.25f, 1f);
        alpha.setDuration(FADE_TRANSITION);
        alpha.start();
    }

    // Circularizes or rounds the corners of a bitmap in a background thread
    private enum ShapeType { CIRCLE, ROUNDED }
    private class ShapeBitmapTask extends AsyncTask<Bitmap, Void, Bitmap> {
        private final ImageLoadListener mImageLoadListener;
        private final ShapeType mShapeType;
        private int mRoundedCornerRadiusPx;
        private static final int ROUNDED_CORNER_RADIUS_DP = 2;

        public ShapeBitmapTask(ShapeType shapeType, ImageLoadListener imageLoadListener) {
            mImageLoadListener = imageLoadListener;
            mShapeType = shapeType;
            if (mShapeType == ShapeType.ROUNDED) {
                mRoundedCornerRadiusPx = DisplayUtils.dpToPx(getContext(), ROUNDED_CORNER_RADIUS_DP);
            }
        }

        @Override
        protected Bitmap doInBackground(Bitmap... params) {
            if (params == null || params.length == 0) return null;

            Bitmap bitmap = params[0];
            switch (mShapeType) {
                case CIRCLE:
                    return ImageUtils.getCircularBitmap(bitmap);
                case ROUNDED:
                    return ImageUtils.getRoundedEdgeBitmap(bitmap, mRoundedCornerRadiusPx, Color.TRANSPARENT);
                default:
                    return bitmap;
            }
        }

        @Override
        protected void onPostExecute(Bitmap bitmap) {
            if (bitmap != null) {
                setImageBitmap(bitmap);
                if (mImageLoadListener != null) {
                    mImageLoadListener.onLoaded();
                    fadeIn();
                }
            } else {
                if (mImageLoadListener != null) {
                    mImageLoadListener.onError();
                }
            }
        }
    }
}