import React from 'react';
import { View, Text } from 'react-native';
import { Scene, Router, Actions } from 'react-native-router-flux';

import RegisterForm from './scenes/RegisterForm';
import LoginForm from './scenes/LoginForm';
import LiveVideo from './scenes/LiveVideo';
import ListaCursadas from './scenes/ListaCursadas';
import ListaClases from './scenes/ListaClases.js';
import Clase from './scenes/Clase.js';
import Profesor from './scenes/Profesor';
import Menu from './scenes/Menu';

const scenes = Actions.create(
	<Scene key="container">

		<Scene key="auth">
			<Scene key="login" component={LoginForm} title="Ingresar" initial />
			<Scene key="register" component={RegisterForm} title="Registrarse" />
		</Scene>

		<Scene key="main">
			<Scene key="ListaCursadas" rightTitle="Curso en vivo" onRight={ () => Actions.Live() } component={ListaCursadas} title="Cursadas" />
			<Scene key="ViewCursada" component={ListaClases} title="Clases" />
			<Scene key="ViewClase" component={Clase} title="Clase" />
			<Scene key="ViewProf" component={Profesor} title="Profesor" />
			<Scene key="Live" title="Curso en vivo" component={LiveVideo} />
		</Scene>
		<Scene key="Menu" title="Menu" component={Menu} panHandlers={null} direction="vertical" />

	</Scene>
);

const RouterComponent = () => {
	return (
		<Router sceneStyle={{ paddingTop: 55 }} scenes={scenes} />
	);
};

export default RouterComponent;