A flickr of functional programming

https://drboolean.gitbooks.io/mostly-adequate-guide/content/ch6.html

by mickeyvip

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.11/require.min.js"></script>

Babel + JSX

requirejs.config({
  paths: {
    ramda: 'https://cdnjs.cloudflare.com/ajax/libs/ramda/0.13.0/ramda.min',
    jquery: 'https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min'
  }
});

require([
    'ramda',
    'jquery'
  ],
  (_, $) => {
    const trace = _.curry((tag, x) => {
      console.log(tag, x);
      return x;
    })
    // app goes here
		const Impure = {
			getJSON: _.curry((callback, url) => $.getJSON(url, callback)),
			setHtml: _.curry((sel, html) =>	$(sel).html(html))
		};
		
		const url = (term) => 
			`https://api.flickr.com/services/feeds/photos_public.gne?tags=${term}&format=json&jsoncallback=?`;
		
		const mediaUrl = _.compose(_.prop('m'), _.prop('media'));
		const srcs = _.compose(_.map(mediaUrl), _.prop('items'));
		const img = (url) => $('<img />', { src: url });
		
		//const images = _.compose(_.map(img), srcs);
		// We can inline the call to srcs in images thanks to equational reasoning and purity.
		//const images = _.compose(_.map(img), _.map(mediaUrl), _.prop('items'));
		// map's composition law
		// var law = compose(map(f), map(g)) == map(compose(f, g));
		//const images = _.compose(_.map(_.compose(img, mediaUrl)), _.prop('items'));
		// Now the bugger will only loop once while turning each item into an img
		// extracting the function out
		const mediaToImg = _.compose(img, mediaUrl);
		const images = _.compose(_.map(mediaToImg), _.prop('items'));
		const renderImages = _.compose(Impure.setHtml("body"), images);
				
		const app = _.compose(Impure.getJSON(renderImages), url);
		//const app = _.compose(Impure.getJSON(trace("result")), url);
		app("cats");
  });