"use strict";
fetch('https://earth-for-all.com/twentyseventeen/wp-json/wp/v2/posts/49?_embed')
	.then(data => {
		if (!data.ok) {
			throw Error(data.status)
		}
			return data.json()
	})
	.then(post => {
		var txt="" 
		txt = "<h2 class='padding-32 text-center'>"  + post.title['rendered'] + "</h2>"
		document.querySelector(".header-content").innerHTML = txt
		txt=""
		txt += "<p><b>Post ID: </b>" + post['id'] + "</p>"
		txt += "<p><b>Author ID: </b>" + post['author'] + "</p>"
		txt += "<p><b>Author Name: </b>" + post._embedded.author[0].name + "</p>"
		txt += "<p><b>Author: </b>" + post._embedded.author[0].name + "</p>"
		txt += "<p><b>Author Description: </b>" + post._embedded.author[0].description + "</p>"
		txt += "<p><b>Date: </b>" + post['date'] + "</p>"
		txt += "<p>" + post['date'] + "</p>"
		txt += "<p><b>Slug: </b>" + post['slug'] + "</p>"
		txt += "<p><b>Link: </b>" + post['link'] + "</p>"
		txt += "<p><b>Status: </b>" + post['status'] + "</p>"
		var singleThumbnailImage = post['_embedded']['wp:featuredmedia'][0].media_details.sizes.thumbnail.source_url 
		txt += "<p><b>Thumbnail Image Link: </b>"+ singleThumbnailImage + "</p>"
		txt += "<img  src=' " + singleThumbnailImage + " ' alt=' "+ post.title['rendered']+" ' />" 
		txt += "<p><b>Guid: </b>" + post.guid['rendered'] + "</p>"
       		txt += "<p><b>Type: </b>" + post['type'] + "</p>"
       		txt += "<p>" + post.content['rendered'] + "</p>"
       		txt += "<p><b>Categories: </b></p>"
       		var cats = post['categories']
        		for(var i = 0; i < cats.length; i++) {
      				txt += "<p>" + cats[i] + "</p>"
			}
        		txt += "<p><b>Tags: </b>"
		var tags = post['tags']
			for(var i = 0; i < tags.length; i++) {
      				txt += "<p>" + tags[i] + "</p>"
			}
        		txt += "<br />" 
			document.querySelector(".content").innerHTML = txt
	})
	.catch(e => {
		console.log(e)
	})