giffy-break - npm Package Compare versions

Comparing version 0.2.2 to 0.3.0

index.js

		@@ -33,5 +33,3 @@ 'use strict';
		}
		}).then(res => {
		return res.body.data.map(gif => gif.images.original.url);
		});
		}).then(res => res.body.data);
		}
		@@ -38,0 +36,0 @@

package.json

		{
		"name": "giffy-break",
		"version": "0.2.2",
		"version": "0.3.0",
		"description": "Watch random gifs in a browser while your promise is resolving",
		@@ -51,2 +51,3 @@ "license": "MIT",
		"delay": "^1.3.1",
		"opn": "^4.0.1",
		"xo": "^0.12.1"
		@@ -53,0 +54,0 @@ },

public/client.js

		@@ -1,16 +0,42 @@
		(function (root, io, baseUrl) {
		(function (root, io, baseUrl, $) {
		'use strict';
		const socket = io(baseUrl);
		function preloadGif(gif) {
		const video = $('video', null, {
		src: gif.images.original.mp4,
		autoplay: true,
		loop: true
		});

		return new Promise(resolve => {
		video.addEventListener('canplay', () => {
		resolve(video);
		});
		});
		}

		function renderGif(gif) {
		const node = $('a', null, {
		href: gif.bitly_gif_url
		});

		return preloadGif(gif).then(vid => {
		node.appendChild(vid);
		return node;
		});
		}

		const render = {
		message: text => `<h1>${text}</h1>`,
		rejectMessage: text => `<h1 class="error">${text}</h1>`,
		gif: url => `<a href="${url}"><img src="${url}" /></a>`
		message: msg => $('h1', msg),
		rejectMessage: msg => $('h1', msg, {className: 'error'}),
		gif: renderGif
		};

		const display = renderFn => html => {
		root.innerHTML = renderFn(html);
		const display = fn => data => {
		Promise.resolve(fn(data)).then(node => {
		root.innerHTML = '';
		root.appendChild(node);
		});
		};

		socket
		io(baseUrl)
		.on('start-message', display(render.message))
		@@ -23,3 +49,4 @@ .on('resolve-message', display(render.message))
		window.io,
		window.location.origin
		window.location.origin,
		(tag, text, props) => Object.assign(document.createElement(tag), text && {innerHTML: text}, props)
		);

public/index.css

Sorry, the diff of this file is not supported yet

New alerts