Kirill Borzov oresh

OS X Screencast to animated GIF

This gist shows how to create a GIF screencast using only free OS X tools: QuickTime, ffmpeg, and gifsicle.

To capture the video (filesize: 19MB), using the free "QuickTime Player" application:

	// Search Linkedin Companies
	$ = jQuery;
	var $person, text, timer;
	var out = [];

	var timer = setInterval(function(){
	getPeople();
	clickPager();
	}, 2200);

	var messages = document.getElementsByClassName('_3058 _ui9')
	var name = document.getElementsByClassName('_673w')[0].getElementsByClassName('_3oh-')[0].innerText;

	[...messages].map( (message) => {
	var out = '';
	out += message.classList.contains('_43by') ? 'Me: ' : name+': ';
	var text = message.getElementsByClassName('_58nk');
	if (text.length) return out + text[0].innerText;

	}).filter(message => !!message).join('\n')

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<!-- The above 3 meta tags must come first in the head; any other head content must come after these tags -->

	<title>Bootstrap 101 Template</title>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

	// scroll down to the bottom of list of group members
	// then insert this code
	var wrapper = document.getElementById('groupsMemberSection_recently_joined');
	var csv = '';
	var people = wrapper.getElementsByClassName('_60rh _gse');
	var _csv = [];
	var person, position, year;

	for (var i = 0, len = people.length; i < len; i++) {

	$ = jQuery;
	var $person, $next, text, timer;
	var next_text = '';
	var out = [];

	var timer = setInterval(function(){
	getPeople();
	clickPager();
	}, 5500);

	// filter wrapper class, that has checkboxes.
	var $filters = $('.filters', context);
	if($filters.length) {
	var itemFilter = {
	itemClass: '.item-container',
	categoryClass: '.category-name',
	dataArr: 'data-filters',
	sectionClass: 'section.category',
	sections: $(this.sectionClass),
	items: $(this.itemClass),

	var $responsiveImages = $('img[data-mobile-src]');
	if ($responsiveImages.length) {
	var imgresizeCatch;
	var changeImageSrc = function() {
	var desktop = getWindowWidth() > 959;
	for (var i = 0, len = $responsiveImages.length; i < len; i++) {
	var $img = $responsiveImages.eq(i);
	if (desktop) {
	if ($img.attr('data-desktop-src') != $img.attr('src')) {
	$img.attr('src',$img.attr('data-desktop-src'));