wir
12/2/2015 - 1:48 PM

Give it a REST app using data from give-it-a-rest.dev

Give it a REST app using data from give-it-a-rest.dev

var giar_settings = {
	api_base: 'http://give-it-a-rest.dev/wp-json/give-it-a-rest/v1/',
	endpoints: {
		posts: { route: 'list-posts/', method: 'GET' },
		vote: { route: 'vote/', method: 'POST' }
	}
}

var $el;
var posts = {};
var votedOn = JSON.parse( localStorage.getItem( 'giar_votedOn' ) );

function getPostsFromServer( callback ) {
	doAjax( giar_settings.endpoints.posts, {} )
		.done( function( data ) {
			posts = data;
			if ( 'function' === typeof callback ) {
				callback.call();
			}
		} );
}
function getRandomPost() {
	var post = posts[ Math.floor( Math.random() * posts.length ) ];
	var current = $el.data( 'post' );
	if ( 'object' == typeof current && current.ID === post.ID ) {
		post = getRandomPost();
	}
	return post;
}
function showPost( post ) {
	$el.data( 'currentPost', post );
	$el.find( 'h1' ).text( post.title );
	$el.find( '.votes .up' ).text( post.upvotes );
	$el.find( '.votes .down' ).text( post.downvotes );
}

function getLS( key ) {
	var data = window.localStorage.getItem( key );
	try {
		return JSON.parse( data );
	} catch ( e ) {
		return data;
	}
}

function setLS( key, data ) {
	return window.localStorage.setItem( key, JSON.stringify( data ) );
}

function voteOnPost( post, updown ) {
	var readingList = getLS( 'readingList' ) || [];

	if ( 'up' === updown ) {
		if ( -1 === readingList.indexOf( post.ID ) ) {
			readingList.push ( post.ID );
			setLS( 'readingList', readingList );
			addReadingListElem( post );
		}
	}

	showPost( getRandomPost() );

	doAjax( giar_settings.endpoints.vote, {
		vote: updown,
		id: post.ID
	} );

}

function addReadingListElem( post ) {
	$el.find( '.reading-list ul' ).append( '<li data-id="' + post.ID + '"><a target=_blank href="' + post.permalink + '">' + post.title + '</a></li>' );
}

function doAjax( endpoint, data ) {
	return $.ajax( {
		url: giar_settings.api_base + endpoint.route,
		method: endpoint.method,
		data: data
	} );
}

$( function() {
	$el = $( '.giar' );

	getPostsFromServer( initAfterAjax );

	function initAfterAjax() {
		showPost( getRandomPost() );

		// display saved reading list
		$el.find( '.reading-list ul' ).empty();
		$.each( getLS( 'readingList' ), function( i, ID ) {
			$.each( posts, function( i, post ) {
				if ( post.ID === ID ) {
					addReadingListElem( post );
				}
			} );
		} );
	}

	$el.on( 'click', '.votes span', function( e ) {
		voteOnPost( $el.data( 'currentPost' ), $( this ).attr( 'class' ) );
	} );

	$el.on( 'click', '.clear-list', function( e ) {
		e.preventDefault();
		setLS( 'readingList', [] );
		$el.find( '.reading-list ul' ).empty();
	} );

} );