'use strick';
const e = React.createElement;
const BrowserRouter  = ReactRouterDOM.BrowserRouter;
const Link = ReactRouterDOM.Link;
const Route = ReactRouterDOM.Route;
const Switch = ReactRouterDOM.Switch;
var urlPath = 'https://hgtienda.wsoft.com.mx/';

console.log('entra')

class App extends React.Component{
	constructor(props){
		super(props);
		this.state = {
			isLoading: true,
			showMenu: false,
			cartProducts:0,
			anouncement:'Adquiere productos de la tienda virtual | Disponible para Ciudad Valles',
			arrCategoriesList: [
			{ 
				id_categoria:'1',
				src: `https://hg.wsoft.com.mx/imgs/main-banner@2x.png`,
				alt : 'categoria-1',
				url : '#'
			},
			],
			arrCategoriesProducts: [],
			submitForm:false,
			stepPagos: 1,
			addCard:0,
			arrDatos: { },
			loginNumber: '',
			porcDesc: 0,
			code: '',
			loginIntent: 1,
			carritoProductos: [],
		}
	}

	componentDidMount(){
		setTimeout(() => {
			this.setState({ isLoading: false, })
		}, 1000)

		this.getCategories()

	}

	getCategories(){
		const { arrCategoriesProducts  } = this.state;
		fetch('https://hg.wsoft.com.mx/REST/controllers/controllerTienda.php?opt=getListProductos',{
			method: "POST",
			mode: "cors",
		})
		.then(response => response.json())
		.then((response) => {
			this.setState({
				arrCategoriesProducts: response.list
			})
		})
	}

	updateState(obj){
		this.setState(obj)
	}

	render(){
		const {isLoading, cartProducts,arrCategoriesProducts} = this.state;

		if(isLoading)
			return <p>Cargando...</p>

		return(
		<BrowserRouter basename="/">
			<Switch>

				<Route exact path="/">
					<Home state={this.state} updateState={this.updateState.bind(this)} />
				</Route>

				<Route exact path="/productos/:id_categoria">
					<ProductosList state={this.state} updateState={this.updateState.bind(this)} />
				</Route>

				<Route path="/carrito">
					<Carrito state={this.state} updateState={this.updateState.bind(this)} />
				</Route>

				<Route path="/pago">
					<Pago state={this.state} updateState={this.updateState.bind(this)} />
				</Route>

			</Switch>
		</BrowserRouter>
		)
	}

}


const domContainer = document.querySelector('#root');
ReactDOM.render(e(App), domContainer);