import Tool from '../Systems/Tool';
import {View , Text , Button,StyleSheet , Image} from 'react-native';
import React from 'react';
//import { Icon } from 'react-native-elements'
import Icon from "react-native-vector-icons/MaterialIcons";
import Library from 'trapilib/dist/lib';


let {
	CoreSystem,
	ViewSystem,
	ViewNode
} = Library; 


const styles = StyleSheet.create({
  container: {
    flex: 1,
    borderRadius: 4,
    borderWidth: 1,
    borderColor: '#d6d7da',
    backgroundColor: 'red',
    alignItems: 'center',
    justifyContent: 'center',
  },
  text:{
  	flex:1,
  	backgroundColor:'red'
  }
});

const mStyle = StyleSheet.create({
	container:{
		flex:1,
		flexDirection:'row'
	}
})


export default class Select extends Tool{
	constructor(props){
		super(props)
		this.selectedNode = null;
	}

	editViewNode(CS,node){
		if(!node) return;
		
		
		if( this.selectedNode ) {
			this.selectedNode.props.selected = false;
		}

		node.props = {
			...node.props,
			selected: true
		}
		this.selectedNode = node;
		let View = CS.getCurrentView();
		// this.selectedNodeParent = View.getParent(node);
	}

	render(){
		let selectStyle;
		if(this.active){
			selectStyle = {backgroundColor:"#a6a6a6"}
		}else{
			selectStyle = {backgroundColor:"#F1F1F1"}
		}
		
		return(
			<View>
				<Image  name='near me'
	  				style={{width: 20, height: 20}}
	  				source= {this.active ? require('../assets/select.svg') : require('../assets/outline.svg')}
	  				containerStyle={selectStyle}
  				/>
			</View>
		)
	}
}

const UnSelectedCont = StyleSheet.create({
	container:{
		padding:0,
		borderWidth:1
	}
})