OMDB Movie Info

Show information for your favourite films & movies.

	<template>
	<div>
	<v-layout>
	<v-flex>
	<v-card>
	<v-img :src="movie.Poster"></v-img>
	<v-card-title primary-title>
	<div>
	<h3 class="headline mb-0">{{movie.Title}}</h3>
	<div>{{movie.Plot}}</div>
	</div>
	<div>
	<v-list>
	<v-list-tile @click="">
	<v-list-tile-content>
	<v-list-tile-title>{{movie.Year}}</v-list-tile-title>
	<v-list-tile-sub-title>Year</v-list-tile-sub-title>
	</v-list-tile-content>
	</v-list-tile>
	<v-list-tile @click="">
	<v-list-tile-content>
	<v-list-tile-title>{{movie.Actors}}</v-list-tile-title>
	<v-list-tile-sub-title>Actors</v-list-tile-sub-title>
	</v-list-tile-content>
	</v-list-tile>
	<v-list-tile @click="">
	<v-list-tile-content>
	<v-list-tile-title>{{movie.Director}}</v-list-tile-title>
	<v-list-tile-sub-title>Director</v-list-tile-sub-title>
	</v-list-tile-content>
	</v-list-tile>
	<v-list-tile @click="">
	<v-list-tile-content>
	<v-list-tile-title>{{movie.Writer}}</v-list-tile-title>
	<v-list-tile-sub-title>Writers</v-list-tile-sub-title>
	</v-list-tile-content>
	</v-list-tile>
	<v-list-tile @click="">
	<v-list-tile-content>
	<v-list-tile-title>{{movie.Production}}</v-list-tile-title>
	<v-list-tile-sub-title>Production</v-list-tile-sub-title>
	</v-list-tile-content>
	</v-list-tile>
	<v-list-tile @click="">
	<v-list-tile-content>
	<v-list-tile-title>{{movie.Website}}</v-list-tile-title>
	<v-list-tile-sub-title>Website</v-list-tile-sub-title>
	</v-list-tile-content>
	</v-list-tile>
	<v-list-tile @click="">
	<v-list-tile-content>
	<v-list-tile-title>{{movie.Runtime}}</v-list-tile-title>
	<v-list-tile-sub-title>Runtime</v-list-tile-sub-title>
	</v-list-tile-content>
	</v-list-tile>
	<v-list-tile @click="">
	<v-list-tile-content>
	<v-list-tile-title>{{movie.Rated}}</v-list-tile-title>
	<v-list-tile-sub-title>Rated</v-list-tile-sub-title>
	</v-list-tile-content>
	</v-list-tile>
	<v-list-tile @click="">
	<v-list-tile-content>
	<v-list-tile-title>{{movie.Released}}</v-list-tile-title>
	<v-list-tile-sub-title>Released</v-list-tile-sub-title>
	</v-list-tile-content>
	</v-list-tile>
	<v-list-tile @click="">
	<v-list-tile-content>
	<v-list-tile-title>{{movie.DVD}}</v-list-tile-title>
	<v-list-tile-sub-title>DVD</v-list-tile-sub-title>
	</v-list-tile-content>
	</v-list-tile>
	<v-list-tile @click="">
	<v-list-tile-content>
	<v-list-tile-title>{{movie.Country}}</v-list-tile-title>
	<v-list-tile-sub-title>Country</v-list-tile-sub-title>
	</v-list-tile-content>
	</v-list-tile>
	<v-list-tile @click="">
	<v-list-tile-content>
	<v-list-tile-title>{{movie.Genre}}</v-list-tile-title>
	<v-list-tile-sub-title>Genre</v-list-tile-sub-title>
	</v-list-tile-content>
	</v-list-tile>
	<v-list-tile @click="">
	<v-list-tile-content>
	<v-list-tile-title>{{movie.Awards}}</v-list-tile-title>
	<v-list-tile-sub-title>Awards</v-list-tile-sub-title>
	</v-list-tile-content>
	</v-list-tile>
	<v-list-tile @click="">
	<v-list-tile-content>
	<v-list-tile-title>{{movie.imdbID}}</v-list-tile-title>
	<v-list-tile-sub-title>IMDBid</v-list-tile-sub-title>
	</v-list-tile-content>
	</v-list-tile>
	<v-list-tile @click="">
	<v-list-tile-content>
	<v-list-tile-title>{{movie.imdbRating}}</v-list-tile-title>
	<v-list-tile-sub-title>IMDB Rating</v-list-tile-sub-title>
	</v-list-tile-content>
	</v-list-tile>
	<v-list-tile @click="">
	<v-list-tile-content>
	<v-list-tile-title>{{movie.imdbVotes}}</v-list-tile-title>
	<v-list-tile-sub-title>IMDB Votes</v-list-tile-sub-title>
	</v-list-tile-content>
	</v-list-tile>
	<v-list-tile @click="">
	<v-list-tile-content>
	<v-list-tile-title>{{movie.Metascore}}</v-list-tile-title>
	<v-list-tile-sub-title>Metascore</v-list-tile-sub-title>
	</v-list-tile-content>
	</v-list-tile>
	</v-list>
	</div>
	</v-card-title>
	</v-card>
	</v-flex>
	</v-layout>
	</div>
	</template>

	<script>
	module.exports = {
	name: 'ComponentName',
	props: {
	title: {
	type: String,
	default: "Happy Gilmore"
	},
	year: {
	type: String,
	default: "1996"
	},
	ENV: {
	type: Object,
	hidden: true
	}
	},
	data: function () {
	return {
	movie: {}
	}
	},
	mounted: function() {
	this.getMovie();
	},
	methods: {
	getMovie() {
	let apikey = this.ENV["OMDB_APIKEY"];
	var params = {
	y: encodeURI(this.year),
	t: encodeURI(this.title)
	}

	this.$http.get('http://www.omdbapi.com/?t=' + params.t + '&y=' + params.y + '&apikey=' + apikey)
	.then(
	function(result){
	console.log(result.body);
	this.movie = result.body;

	},
	function(error){
	console.log(error.description);
	});
	}
	},
	computed: {}
	}
	</script>

	<style scoped>
	/* styles here */
	</style>