Ryan Parsley RyanParsley

name: Extend Photoshop with Javascript class: middle, center

Extend Photoshop with Javascript

Why!?

You can extend Photoshop (and the rest of Adobe's lineup) via javascript, but it's pretty dubiously documented. People do this, and presumably make money at it, but it looks to be a maddening process. Perhaps there's better documentation behind a developer login, but this is the extent of help that I've found so far.

Extending Photoshop: There be dragons

You can extend Photoshop (and the rest of Adobe's lineup) via javascript, but it's pretty dubiously documented. People do this, and presumably make money at it, but it looks to be a maddening process. Perhaps there's better documentation behind a developer login, but this is the extent of help that I've found so far.

Three paths depending on desired version

Note, there seems to be 3 distinct api changes at these points:

CS 6
CC up to but not including 2014
CC 2014

Choosing a "platform" looks to dictate which tool you should choose.

Unit Testing

Test small bits of code
- Run javascript without involving the whole app
- Faster to run
- Great for adding to watch task
Run via Karma
Written in Jasmine

Boggs, install these!

iTerm2 - better terminal
Anvil - Serve up static sites and Rack apps with simple URLs and zero configuration
Oh My ZSH - A community-driven framework for managing your zsh configuration
MacVim - Man up!
Seil - Remap capslock to esc (good for vim use)

See also: Mac software that I use all the time.

Drupal theming, one approach

You don't need to know much about Drupal to get pretty far in building a theme. It's mostly html and a few magic php bits and bobs floating around. The tricky bit is learning what magic bits exist and what they're called. Let's take a look at some kinds of templates in Drupal. The best way to think about Drupal themes is probably to image russian dolls.

The outer most level of a Drupal theme is html.tpl.php

This is the stuff that likely doesn't change (although it still can) across your site all that much.

https://github.com/RyanParsley/lessie/blob/master/html.tpl.php

	<input
	moneyfy
	currency="{{Config.units.currency}}"
	ng-model-options="{ updateOn: ' blur', debounce: {'blur': 0} }"
	ng-model="priceRange.userMin" />

	.directive('moneyfy', function () {
	return {
	require:'ngModel',
	restrict:'A',
	link:function (scope, elm, attrs, ngModel) {
	console.log("IT HAPPENED!");
	}
	};
	})

	Feature: whatever layout test
	As a user I want visual consistency on the http://whatever.dev website

	Scenario: Contact form
	Given I visit "http://whatever.dev"
	Then "line of copy" should have "font-size" of "14px"
	Then "line of copy" should have "color" of "rgba(97, 97, 97, 1)"

	Then "label, .label" should have "font-size" of "12px"
	Then "label, .label" should have "color" of "rgba(97, 97, 97, 1)"

	RewriteEngine on

	# Don't rewrite files or directories
	RewriteCond %{REQUEST_FILENAME} -f [OR]
	RewriteCond %{REQUEST_FILENAME} -d
	RewriteRule ^ - [L]

	# Rewrite everything else to index.html to allow html5 state links
	RewriteRule ^ index.html [L]

	cd [path/to/site] \|\| exit
	unset GIT_DIR
	git clean -f
	git pull origin develop
	chmod -Rf g+w .