@@ -17,7 +17,7 @@ import ScrollableTabView from 'react-native-scrollable-tab-view';
1717import Swiper from 'react-native-swiper' ;
1818
1919import * as moviesActions from './movies.actions' ;
20- import { IMG_URL , YOUTUBE_KEY , YOUTUBE_URL } from '../../constants/api' ;
20+ import { TMDB_IMG_URL , YOUTUBE_API_KEY , YOUTUBE_URL } from '../../constants/api' ;
2121import Casts from './tabs/Casts' ;
2222import Trailers from './tabs/Trailers' ;
2323import DefaultTabBar from '../_global/scrollableTabView/DefaultTabBar' ;
@@ -111,11 +111,13 @@ class Movie extends Component {
111111 if ( tabName === 'casts' ) this . setState ( { castsTabHeight : height } ) ;
112112 if ( tabName === 'trailers' ) this . setState ( { trailersTabHeight : height } ) ;
113113 // if (tabName === 'similarTo') this.setState({ similarToTabHeight: height });
114+ console . log ( 'tab' , tabName ) ;
115+ console . log ( 'height' , height ) ;
114116 }
115117
116118 _retrieveYoutubeDetails ( ) {
117119 this . props . details . videos . results . map ( item => {
118- const request = axios . get ( `${ YOUTUBE_URL } /?id=${ item . key } &key=${ YOUTUBE_KEY } &part=snippet` )
120+ const request = axios . get ( `${ YOUTUBE_URL } /?id=${ item . key } &key=${ YOUTUBE_API_KEY } &part=snippet` )
119121 . then ( res => {
120122 const data = this . state . youtubeVideos ;
121123 data . push ( res . data . items [ 0 ] ) ;
@@ -147,6 +149,7 @@ class Movie extends Component {
147149 }
148150
149151 render ( ) {
152+ console . log ( 'Hello' ) ;
150153 const iconStar = < Icon name = "md-star" size = { 16 } color = "#F5B642" /> ;
151154 const { details /* similarMovies */ } = this . props ;
152155 const info = details ;
@@ -159,7 +162,7 @@ class Movie extends Component {
159162 // if (this.state.tab === 2) height = this.state.similarToTabHeight;
160163
161164 return ( this . state . isLoading ? < View style = { styles . progressBar } > < ProgressBar /> </ View > :
162- < ScrollView
165+ < ScrollView
163166 style = { styles . container }
164167 onScroll = { this . _onScroll . bind ( this ) }
165168 onContentSizeChange = { this . _onContentSizeChange }
@@ -171,63 +174,63 @@ class Movie extends Component {
171174 progressBackgroundColor = "white"
172175 />
173176 } >
174- < View style = { { height } } >
175- < Swiper
176- style = { styles . swiper }
177- autoplay
178- autoplayTimeout = { 4 }
179- showsPagination = { false }
180- height = { 248 }
181- loop
182- index = { 5 } >
183- {
184- info . images . backdrops . map ( ( item , index ) => (
185- < View key = { index } >
186- < Image source = { { uri : `${ IMG_URL } /w780/${ ( item . file_path ) } ` } } style = { styles . imageBackdrop } />
187- < LinearGradient colors = { [ 'rgba(0, 0, 0, 0.2)' , 'rgba(0,0,0, 0.2)' , 'rgba(0,0,0, 0.7)' ] } style = { styles . linearGradient } />
188- </ View >
189- ) )
190- }
191- </ Swiper >
192- < View style = { styles . cardContainer } >
193- < Image source = { { uri : `${ IMG_URL } /w185/${ info . poster_path } ` } } style = { styles . cardImage } />
194- < View style = { styles . cardDetails } >
195- < Text style = { styles . cardTitle } > { info . original_title } </ Text >
196- < Text style = { styles . cardTagline } > { info . tagline } </ Text >
197- < View style = { styles . cardGenre } >
198- {
199- info . genres . map ( item => (
200- < Text key = { item . id } style = { styles . cardGenreItem } > { item . name } </ Text >
201- ) )
202- }
177+ < View style = { { height } } >
178+ < Swiper
179+ style = { styles . swiper }
180+ autoplay
181+ autoplayTimeout = { 4 }
182+ showsPagination = { false }
183+ height = { 248 }
184+ loop
185+ index = { 5 } >
186+ {
187+ info . images . backdrops . map ( ( item , index ) => (
188+ < View key = { index } >
189+ < Image source = { { uri : `${ TMDB_IMG_URL } /w780/${ ( item . file_path ) } ` } } style = { styles . imageBackdrop } />
190+ < LinearGradient colors = { [ 'rgba(0, 0, 0, 0.2)' , 'rgba(0,0,0, 0.2)' , 'rgba(0,0,0, 0.7)' ] } style = { styles . linearGradient } />
203191 </ View >
204- < View style = { styles . cardNumbers } >
205- < View style = { styles . cardStar } >
206- { iconStar }
207- < Text style = { styles . cardStarRatings } > 8.9</ Text >
208- </ View >
209- < Text style = { styles . cardRunningHours } />
192+ ) )
193+ }
194+ </ Swiper >
195+ < View style = { styles . cardContainer } >
196+ < Image source = { { uri : `${ TMDB_IMG_URL } /w185/${ info . poster_path } ` } } style = { styles . cardImage } />
197+ < View style = { styles . cardDetails } >
198+ < Text style = { styles . cardTitle } > { info . original_title } </ Text >
199+ < Text style = { styles . cardTagline } > { info . tagline } </ Text >
200+ < View style = { styles . cardGenre } >
201+ {
202+ info . genres . map ( item => (
203+ < Text key = { item . id } style = { styles . cardGenreItem } > { item . name } </ Text >
204+ ) )
205+ }
206+ </ View >
207+ < View style = { styles . cardNumbers } >
208+ < View style = { styles . cardStar } >
209+ { iconStar }
210+ < Text style = { styles . cardStarRatings } > 8.9</ Text >
210211 </ View >
212+ < Text style = { styles . cardRunningHours } />
211213 </ View >
212214 </ View >
213- < View style = { styles . contentContainer } >
214- < ScrollableTabView
215- onChangeTab = { this . _onChangeTab }
216- renderTabBar = { ( ) => (
217- < DefaultTabBar
218- textStyle = { styles . textStyle }
219- underlineStyle = { styles . underlineStyle }
220- style = { styles . tabBar }
221- />
222- ) } >
223- < Info tabLabel = "INFO" info = { info } />
224- < Casts tabLabel = "CASTS" info = { info } getTabHeight = { this . _getTabHeight } />
225- < Trailers tabLabel = "TRAILERS" youtubeVideos = { this . state . youtubeVideos } openYoutube = { this . _openYoutube } getTabHeight = { this . _getTabHeight } />
226- { /* <Similar tabLabel="SIMILAR TO" similarMovies={fiveSimilarMovies} getTabHeight={this._getTabHeight} viewMovie={this._viewMovie} /> */ }
227- </ ScrollableTabView >
228- </ View >
229215 </ View >
230- </ ScrollView >
216+ < View style = { styles . contentContainer } >
217+ < ScrollableTabView
218+ onChangeTab = { this . _onChangeTab }
219+ renderTabBar = { ( ) => (
220+ < DefaultTabBar
221+ textStyle = { styles . textStyle }
222+ underlineStyle = { styles . underlineStyle }
223+ style = { styles . tabBar }
224+ />
225+ ) } >
226+ < Info tabLabel = "INFO" info = { info } />
227+ < Casts tabLabel = "CASTS" info = { info } getTabHeight = { this . _getTabHeight } />
228+ < Trailers tabLabel = "TRAILERS" youtubeVideos = { this . state . youtubeVideos } openYoutube = { this . _openYoutube } getTabHeight = { this . _getTabHeight } />
229+ { /* <Similar tabLabel="SIMILAR TO" similarMovies={fiveSimilarMovies} getTabHeight={this._getTabHeight} viewMovie={this._viewMovie} /> */ }
230+ </ ScrollableTabView >
231+ </ View >
232+ </ View >
233+ </ ScrollView >
231234 ) ;
232235 }
233236}
@@ -259,4 +262,4 @@ function mapDispatchToProps(dispatch) {
259262 } ;
260263}
261264
262- export default connect ( mapStateToProps , mapDispatchToProps ) ( Movie ) ;
265+ export default connect ( mapStateToProps , mapDispatchToProps ) ( Movie ) ;
0 commit comments