senaduka/old-meme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Navigation (wip)

Browse Source
This commit is contained in:
MedihaZukic
2017-09-23 21:28:20 +02:00
parent 4b8950b375
commit 701125786c
7 changed files with 268 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/AnatomyCard.js
View File

@@ -2,7 +2,7 @@ import React from 'react';
import { View, Text } from 'react-native';
//import CategoryItem from './CategoryItem';
const AnatomyCard = ({title, text}) => {
const AnatomyCard = ({ title, text }) => {
const { defaultStyle, titleStyle, textStyle } = styles;
return (

50
src/components/Categories.js
View File

@@ -1,19 +1,57 @@
import React from 'react';
import { View } from 'react-native';
import ApplicationHeader from './ApplicationHeader';
import { Actions } from 'react-native-router-flux';
import CategoryItem from './CategoryItem';
const Categories = () => {
const { categoriesContainerStyle, categoriesListStyle } = styles;
const onCategorySelected = (selectedCategoryName) => {
switch (selectedCategoryName) {
case 'ANATOMIJA':
console.log('ANATOMIJA');
Actions.anatomyCard({
title: 'Bradavica',
text: 'O alveoli, o tkivu, o mliječnim putevima i živcima. Zamišljeno je da korisnik može fizički da istraži anatomiju i fizionomiju dojke. Zoomin/zoomout sa tagovima. U sekciji anatomije nas dočeka kao neka interaktivna infografika. Npr, dojka i njen presjek sa tagovima. Kada kliknemo na tag dobijemo karticu sa svim informacijama o alveoli. Kartice kao i sav drugi sadržaj ne bi pravila skrolabilnim, radje bi sadržaj rasporedjivala na više kartica. Ali recimo da u ovoj sekciji fiziologije bi za svaki pojam bila jedna kartica jer su to neki uopšteni pojmovi.'
});
break;
case 'LEKCIJE':
console.log('LEKCIJE');
Actions.lessonCategories();
break;
case 'UPITNIK':
console.log('UPITNIK');
break;
case 'REKLA KAZALA':
console.log('REKLA KAZALA');
break;
default:
console.log('ERROR');
}
};
return (
<View style={categoriesContainerStyle}>
<ApplicationHeader headerText='MeMe' headerBackgroudColor='#6d6e71' />
<View style={categoriesListStyle}>
<CategoryItem categoryName='ANATOMIJA' categoryBackgroudColor='#f7bcbc' />
<CategoryItem categoryName='LEKCIJE' categoryBackgroudColor='#f4d4d4' />
<CategoryItem categoryName='UPITNIK' categoryBackgroudColor='#bcbec0' />
<CategoryItem categoryName='REKLA KAZALA' categoryBackgroudColor='#e6e51a' />
<CategoryItem
categoryName='ANATOMIJA'
categoryBackgroudColor='#f7bcbc'
onCategorySelected={(categoryName) => (onCategorySelected(categoryName))}
/>
<CategoryItem
categoryName='LEKCIJE'
categoryBackgroudColor='#f4d4d4'
onCategorySelected={(categoryName) => onCategorySelected(categoryName)}
/>
<CategoryItem
categoryName='UPITNIK'
categoryBackgroudColor='#bcbec0'
onCategorySelected={(categoryName) => onCategorySelected(categoryName)}
/>
<CategoryItem
categoryName='REKLA KAZALA'
categoryBackgroudColor='#e6e51a'
onCategorySelected={(categoryName) => onCategorySelected(categoryName)}
/>
</View>
</View>
);

8
src/components/CategoryItem.js
View File

@@ -1,15 +1,15 @@
import React from 'react';
import { Text, TouchableOpacity } from 'react-native';
const CategoryItem = (props) => {
const CategoryItem = ({ onCategorySelected, categoryName, categoryBackgroudColor }) => {
const { categoryTextStyle } = styles;
return (
<TouchableOpacity
onPress={() => console.log(props.categoryName)}
style={containerStyle(props.categoryBackgroudColor)}
onPress={() => onCategorySelected(categoryName)}
style={containerStyle(categoryBackgroudColor)}
>
<Text style={categoryTextStyle}>
{props.categoryName}
{categoryName}
</Text>
</TouchableOpacity>
);

30
src/components/LessonCategories.js
View File

@@ -1,19 +1,37 @@
import React from 'react';
import { View } from 'react-native';
import ApplicationHeader from './ApplicationHeader';
import CategoryItem from './CategoryItem';
const LessonCategories = () => {
const { categoriesContainerStyle, categoriesListStyle } = styles;
const onLessonSelected = (selectedLesson) => {
console.log(selectedLesson);
};
return (
<View style={categoriesContainerStyle}>
<ApplicationHeader headerText='LEKCIJE' headerBackgroudColor='#808285' />
<View style={categoriesListStyle}>
<CategoryItem categoryName='IMA LI MLIJEKA?' categoryBackgroudColor='#7270a8' />
<CategoryItem categoryName='ŠTA JE NORMALNO?' categoryBackgroudColor='#819dd1' />
<CategoryItem categoryName='MOGU LI PODOJITI AKO..?' categoryBackgroudColor='#b0bad6' />
<CategoryItem categoryName='ČESTA PITANJA?' categoryBackgroudColor='#e7e2dc' />
<CategoryItem
categoryName='IMA LI MLIJEKA?'
categoryBackgroudColor='#7270a8'
onCategorySelected={(selectedLesson) => (onLessonSelected(selectedLesson))}
/>
<CategoryItem
categoryName='ŠTA JE NORMALNO?'
categoryBackgroudColor='#819dd1'
onCategorySelected={(selectedLesson) => (onLessonSelected(selectedLesson))}
/>
<CategoryItem
categoryName='MOGU LI PODOJITI AKO..?'
categoryBackgroudColor='#b0bad6'
onCategorySelected={(selectedLesson) => (onLessonSelected(selectedLesson))}
/>
<CategoryItem
categoryName='ČESTA PITANJA?'
categoryBackgroudColor='#e7e2dc'
onCategorySelected={(selectedLesson) => (onLessonSelected(selectedLesson))}
/>
</View>
</View>
);