'use strict';

import React from 'react';
import ReactNative from 'react-native';
import YH_Image from '../../../common/components/YH_Image';
import Immutable, {Map} from 'immutable';
import YH_Swiper from '../../../common/components/YH_Swiper';

const {
    View,
    Image,
    TouchableOpacity,
    StyleSheet,
    Dimensions,
    Platform,
} = ReactNative;


export default class ImageSlider extends React.Component {

    constructor(props) {
        super (props);

    }

    shouldComponentUpdate(nextProps){
        if (Immutable.is(nextProps.resource, this.props.resource)
            && nextProps.sliderWidth == this.props.sliderWidth
            && nextProps.sliderHeight == this.props.sliderHeight) {
            return false;
        } else {
            return true;
        }
    }

    render() {

        let {resource, sliderWidth, sliderHeight} = this.props;
        if (!resource || resource.size == 0) {
            return null;
        }

        let data = this.props.resource.toJS();
        if (data) {
            let imageUrl = YH_Image.getSlicedUrl(data.src, sliderWidth, sliderHeight, 2);
            return (
                <TouchableOpacity
                    activeOpacity={1}
                    style={{width: sliderWidth, height: sliderHeight}}
                    onPress={() => {
                        this.props.onPressSlideItem && this.props.onPressSlideItem(data.url, imageUrl, 0);
                    }}
                >
                    <YH_Image
                        url={imageUrl}
                        style={{ width: sliderWidth, height: sliderHeight}}
                    />
                </TouchableOpacity>
            );
        } else {
            return null
        }
    }
}