samhenrigold

Advanced SCSS

Or, 16 cool things you may not have known your stylesheets could do. I'd rather have kept it to a nice round number like 10, but they just kept coming. Sorry.

I've been using SCSS/SASS for most of my styling work since 2009, and I'm a huge fan of Compass (by the great @chriseppstein). It really helped many of us through the darkest cross-browser crap. Even though browsers are increasingly playing nice with CSS, another problem has become very topical: managing the complexity in stylesheets as our in-browser apps get larger and larger. SCSS is an indispensable tool for dealing with this.

This isn't an introduction to the language by a long shot; many things probably won't make sense unless you have some SCSS under your belt already. That said, if you're not yet comfy with the basics, check out the aweso

Analysis of Apple’s rubber band scrolling

January 6, 2013

I recently saw a post on Twitter from @chpwn that described the alogorithm that Apple uses for its “rubber band” or “bungee” scrolling.

b = (1.0 – (1.0 / ((x * c / d) + 1.0))) * d

Observables

You don't really need a framework or fancy cutting-edge JavaScript features to do two-way data binding. Let's start basic - first and foremost, you need a way to tell when data changes. Traditionally, this is done via an Observer pattern, but a full-blown implementation of that is a little clunky for nice, lightweight JavaScript. So, if native getters/setters are out, the only mechanism we have are accessors:

var n = 5;
function getN() { return n; }
function setN(newN) { n = newN; }

console.log(getN()); // 5

setN(10);

Hexadecimal color code for transparency

How to set transparency with hex value ?

For example, you want to set 40% alpha transparence to #000000 (black color), you need to add 66 like this #66000000.

	/**
	* This code is property of Apple Inc.
	* This code is intended for informational use only.
	* Apple has granted no license for distribution or use.
	**/

	const iPad = true;
	const ADSupportsTouches = ("createTouch" in document);
	const ADStartEvent = ADSupportsTouches ? "touchstart": "mousedown";
	const ADMoveEvent = ADSupportsTouches ? "touchmove": "mousemove";

	/**
	* This code is property of Apple Inc.
	* This code is intended for informational use only.
	* Apple has granted no license for distribution or use.
	**/

	var controller = {};
	controller.showInterface = function() {
	if (1 == dataController.showVersionNumber) {
	controller.setUpCacheLogging()

	Please help complete and sort this list. These are the icons visible in the WWDC 2012 Banner. Roughly sorted by size.

	http://www.cocoanetics.com/files/WWDC2012_Banner.png

	alternate, high res pictures of the Banner:
	http://cdn.macrumors.com/article-new/2012/06/photo.jpg

	Path - http://itunes.apple.com/us/app/path/id403639508?mt=8
	Star Walk - http://itunes.apple.com/app/star-walk-guide-dastronomie/id295430577?mt=8
	Instagram - http://itunes.apple.com/us/app/instagram/id389801252?mt=8

	echo "Creating an SSH key for you..."
	ssh-keygen -t rsa

	echo "Please add this public key to Github \n"
	echo "https://github.com/account/ssh \n"
	read -p "Press [Enter] key after this..."

	echo "Installing xcode-stuff"
	xcode-select --install

	THREE.TransformationShader = {
	defines: {},
	uniforms: {

	"tDiffuse": { type: "t", value: texture },
	"opacity": { type: "f", value: 1.0 },
	"translationX": { type: "f", value: 1.0 },
	"translationY": { type: "f", value: 1.0 },
	"translationZ": { type: "f", value: 1.0 },
	"scaleX": { type: "f", value: 1.0 },