Andy McFee andymcfee

Level UP

The purpose of this list is two-fold:

Have a list of all my skills - high-level and low - all in one place
Motivate me to study and level up skills I'm lacking but interested in

Level 1

Mildly familiar, highly intrigued

Assemble

These are things I'm repeatedly having to reference and having trouble finding:

Tutorials I Have Used

A reference list of tutorials I have actually followed and used to learn something.

Angular Testing

Angular JS–Part 14, End to end tests: http://lostechies.com/gabrielschenker/2014/04/18/angular-jspart-14-end-to-end-tests/
Full-Spectrum Testing with AngularJS and Karma :http://www.yearofmoo.com/2013/01/full-spectrum-testing-with-angularjs-and-karma.html

Broad Request, Broad Approach

Vol. 1: Offline Websites

The Request

Client wants a 2-3 page mini-site. Some pages are static (Home, Contact) where the content will never change and dynamic (Product page) where client has the ability to add/remove new products to a gallery or list of products.

Client also wants for the site to be accessible when they don't have access to an internet connection (at an event or visiting retailers, customers, etc).

The Approach

Convert MOV to GIF using FFmpeg and ImageMagick

I tried a few different techniques to make a GIF via command-line and the following gives me the best control of quality and size. Once you're all setup, you'll be pumping out GIFs in no time!

Preparation

Install FFmpeg

$ brew install ffmpeg [all your options]
- Example: $ brew install ffmpeg --with-fdk-aac --with-ffplay --with-freetype --with-frei0r --with-libass --with-libvo-aacenc --with-libvorbis --with-libvpx --with-opencore-amr --with-openjpeg --with-opus --with-rtmpdump --with-schroedinger --with-speex --with-theora --with-tools

Install ImageMagick

	<?xml version="1.0" encoding="UTF-8"?>
	<!DOCTYPE plist PUBLIC "-//Apple Computer//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
	<!-- Generated by: TmTheme-Editor -->
	<!-- ============================================ -->
	<!-- app: http://tmtheme-editor.herokuapp.com -->
	<!-- code: https://github.com/aziz/tmTheme-Editor -->
	<plist version="1.0">
	<dict>
	<key>gutterSettings</key>
	<dict>

	/*
	* @include triangle within a pseudo element and add positioning properties (ie. top, left)
	* $direction: up, down, left, right
	*/
	@mixin triangle($direction, $size: 6px, $color: #222){
	content: '';
	display: block;
	position: absolute;
	height: 0; width: 0;
	@if ($direction == 'up'){

	/*
	* $direction: top or bottom
	*
	*/

	@mixin tooltip($content: attr(data-tooltip), $direction: top) {
	position: relative;
	&:before, &:after {
	display: none;
	z-index: 98;

	._4f7n {
	background-color: transparent;
	background-image: none;
	box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0);
	-webkit-box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0);
	border-bottom: none;
	}

	._4f7n:after {
	background-image: none;

	#!/bin/sh

	# Some things taken from here
	# https://github.com/mathiasbynens/dotfiles/blob/master/.osx

	# Set the colours you can use
	black='\033[0;30m'
	white='\033[0;37m'
	red='\033[0;31m'
	green='\033[0;32m'