Piotr Pałek piotrpalek

Data Down / Actions Up
- http://emberjs.jsbin.com/nayaho/edit?html,js - Interdependent select boxes. No observers.
- http://ember-twiddle.com/2d7246875098d0dbb4a4 - One Way Input
Plain JSBin's
- http://rwjblue.jsbin.com/pixeki/edit?html,js,output
Ember Version Base JSBin's
- 1.0 - http://emberjs.jsbin.com/juluje/edit?html,js,output
1.1 - http://emberjs.jsbin.com/cofufo/edit?html,js,output

This post is also on my blog, since Gist doesn't support @ notifications.

Components are taking center stage in Ember 2.0. Here are some things you can do today to make the transition as smooth as possible:

Use Ember CLI
In general, replace views + controllers with components
Only use controllers at the top-level for receiving data from the route, and use Ember.Controller instead of Ember.ArrayController or Ember.ObjectController
Fetch data in your route, and set it as normal properties on your top-level controller. Export an Ember.Controller, otherwise a proxy will be generated. You can use Ember.RSVP.hash to simulate setting normal props on your controller.

Multiple Ember Data stores

Need a separate data store? Maybe a temporary one for search results? Go for it!

// app/components/search-box.js
import Ember from 'ember';

export default Ember.Component.extend({
  store: Ember.inject.service('search-store'),

Stuff I wish I'd known sooner about service workers

I recently had several days of extremely frustrating experiences with service workers. Here are a few things I've since learned which would have made my life much easier but which isn't particularly obvious from most of the blog posts and videos I've seen.

I'll add to this list over time – suggested additions welcome in the comments or via twitter.com/rich_harris.

Use Canary for development instead of Chrome stable

~~Chrome 51 has some pretty wild behaviour related to console.log in service workers. Canary doesn't, and it has a load of really good service worker related stuff in devtools.~~

	# ~/.tmux.conf
	#
	# See the following files:
	#
	# /opt/local/share/doc/tmux/t-williams.conf
	# /opt/local/share/doc/tmux/screen-keys.conf
	# /opt/local/share/doc/tmux/vim-keys.conf
	#
	# URLs to read:
	#

	#!/usr/bin/perl

	# Emacs starter for Emacs mac port

	# Thanks to Aquamacs Project and David Reitter

	my $args = "";
	my $tmpfiles = "";

	for my $f (@ARGV) {

	TARGET=blink
	SOURCES=blink.c
	DEPS=
	COBJ=$(SOURCES:.c=.o)

	CC=avr-gcc
	OBJC=avr-objcopy
	MCU=atmega328p
	CFLAGS=-I. -Wall -Os -DF_CPU=16000000UL
	LDFLAGS=

	var PostsApi = require('webapi/posts'),
	// assuming the api object from the jsbin snippet
	Reflux = require('reflux');

	var PostActions = createActions(["load", "loadError"]);
	// load action is invoked either from:
	// * top most component's componentDidMount
	// function in your application, or
	// * window.onLoad
	// I prefer the first strategy because that'll

	App.LibraryRoute = App.ApplicationRoute.extend({
	activate: function () {
	//no longer enter
	this._super();
	only called once on entering a route.
	},

	beforeModel: function () {
	// any state you want in place before the model is initialized, this is called before any model promises are resolved
	// also could be used to conditionally prevent access to a route by throwing transition.abort

	///
	/// Calculates the color of a linear gradient at a specific point.
	///
	/// @param {Color} $start - gradient’s start color
	/// @param {Color} $end - gradient’s end color
	/// @param {Number} $point - point of the gradient (between 0 and 1, or 0% and 100%) at which we want the color
	/// @return {Color}
	///
	/// @example scss
	/// background-color: gradient-color-at(#BBE087, #DCDE85, 0.4);