gistfile1.sh

#!/bin/bash
for f in `find ./app/app/data -name "index.html"`;do

	png=${f/html/png}
	phantomjs ./bin/rasterize.js $f $png "entire page"
	metadataFile=${f/index/meta-data}
	metadataFile=${metadataFile/html/json}
	IMG_CHARS=$(identify "${png}" 2> /dev/null) || die "${IMAGE} is not a proper image"
	
	# grab width and height
	IMG_CHARS=$(echo "${IMG_CHARS}" | sed -n 's/\(^.*\)\ \([0-9]*\)x\([0-9]*\)\ \(.*$\)/\2 \3/p')
	
	WIDTH=$(echo "${IMG_CHARS}" | awk '{print $1}')
	HEIGHT=$(echo "${IMG_CHARS}" | awk '{print $2}')
	
	sed -i '' '2i\
	"width" : "'$WIDTH'px",
	' $metadataFile
	sed -i '' '3i\
	"height" : "'$HEIGHT'px",
	' $metadataFile
	
	# We can't do a division with float in bash, so we use awk :D
	heightToHave=$(awk "BEGIN {printf \"%.0f\",${WIDTH}/1.67}")
	percentageCrop=$(awk "BEGIN {printf \"%.0f\",${heightToHave}*100/${HEIGHT}}")
	
	# crop the right percentage
	convert ${png} -crop 100%x${percentageCrop}%+0+0 ${png}
	convert ${png} -resize 250x150! ${png}

done