import React from 'react';
import Modularity from 'modularity-front';
import { Row, CardTitle, Button, Col, Card } from 'react-materialize';
import './Card.css';
let Module = Modularity.Module;

class CardModule extends Modularity.Module {
	constructor(props) {
		super(props);
	}

	addProd (e) {
		e.preventDefault();
		
		let prod = {
			id:this.props.id,
			name:this.CardTitle.value,
			price:this.Price.value,
			image:this.CardImage.value,
			quantity:1
		}
		this.product.set(prod)
		e.stopPropagation();
	}
    
	render() {
		var CardButton = this.CardButton.value;
		
		return(
			<div className={"custom_card " + this.props.className}>
				<Card className="hoverable"
					header={
					<CardTitle reveal className= "card_image cursor" 
				    	onClick={() => this.props.onClick && this.props.onClick()}
						image={this.CardImage.value} waves='light'/>
					}
				    title={this.CardTitle.value}
				    reveal={this.CardBody.value}
				   	actions={[CardButton ? 
				    (
				    	<div key={this.getId()} className="bottom_card">
				    		<small className="pricenovat">χωρίς ΦΠΑ {(this.Price.value * 0.76).toFixed(2)} €</small>
			    			<div className="price">
			    				<div>{this.Price.value} €</div>
			    			</div>
				    		<div>
					    		<Button onClick={(e) => this.addProd(e)} 
					    		floating small className='red' waves='light' icon='add'  />
				    		</div>
				    	</div>
				    )
				    :(<label>Price here</label>)]}
					>
				</Card>
			</div>
			
			);
				    
	}
}

CardModule.Inputs = {
	
	CardTitle:{
		type: Module.Types.Text,
		
	},
	CardBody: {
		type: Module.Types.Text,
		defaultValue:"I am a very simple card. I am good at containing small bits of information. I am convenient because I require little markup to use effectively." 	
		
	},
	CardImage:{
		type: Module.Types.Text,
		
	},
	Price:{
		type: Module.Types.Real,
		defaultValue:null
	},
	CardButton:{
		//should be boolean if we have just add 
		type:Module.Types.Text,
		defaultValue:true
	}	
	
}

CardModule.Outputs = {
	product:{
	}
}



CardModule.Category = "sxoinas";
export default CardModule;