'use strict';

import React from 'react';
import ReactNative from 'react-native';
import {isEmptyObject} from '../../utils/Utils';
import Immutable, {Map} from 'immutable';

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

export default class IndexListView extends React.Component {

    constructor(props) {
        super (props);
        this.onTouchMove = this.onTouchMove.bind(this);
    }

    onTouchMove(e) {
        let {dataSource} = this.props;
        let Y =  e.nativeEvent.pageY - Math.ceil((viewHeight - dataSource.length * (itemHeight+2))/2) - 8;
        var index = Math.ceil(Y/(itemHeight+2))-1;
        let sectionID = dataSource[index]
        this.props.onLetterPress && this.props.onLetterPress(index,sectionID);
    }

    render() {

        let {dataSource} = this.props;
        if (dataSource.length == 0) {
            return null;
        }
 		let keyData = [];

        keyData.push(<Image key={'search'} style={styles.image} source={require('../../images/search.png')}/>);
        for (var i = 0; i < dataSource.length; i++) {
            let name = dataSource[i];
            if (name == '0-9') {
				name = '0';
			}
            keyData.push(<Text key={i} style={styles.text}>{name}</Text>);
        }

        return (
            <View style={styles.container} onTouchStart={this.onTouchMove} onTouchMove={this.onTouchMove} >
				{keyData.map((elem, index) => {return elem;})}
            </View>
        );
    }
}

let {width, height} = Dimensions.get('window');
let itemHeight = 12;
let viewHeight = height - 112;

let styles = StyleSheet.create({
    container: {
		position: 'absolute',
		width: 10,
        height: viewHeight,
		bottom : 1,
		right: 2,
		backgroundColor: 'rgba(255,255,255,0.2)',
		justifyContent: 'center',
    },
	text: {
		justifyContent: 'center',
		textAlign: 'center',
		fontSize: 10,
		color: 'black',
		backgroundColor: 'transparent',
        marginTop: 2,
	},
    image: {
        width: 8,
        height: 8,
    },
});