Joshua Kleckner Lokua

AngularJS Directive Attribute Binding Explanation

When using directives, you often need to pass parameters to the directive. This can be done in several ways. The first 3 can be used whether scope is true or false. This is still a WIP, so validate for yourself.

Raw Attribute Strings

<div my-directive="some string" another-param="another string"></div>

Two way iframe communication

The main difference between the two pages is the method of sending messages. Recieving messages is the same in both.

Parent

Send messages to iframe using iframeEl.contentWindow.postMessage Recieve messages using window.addEventListener('message')

iframe

Prolog

Google Chrome Developers says:

The new WOFF 2.0 Web Font compression format offers a 30% average gain over WOFF 1.0 (up to 50%+ in some cases). WOFF 2.0 is available since Chrome 36 and Opera 23.

Some examples of file size differences: WOFF vs. WOFF2

TTF to WOFF2 converting

http://www.fontsquirrel.com/tools/webfont-generator

	emotion :+1: :-1: :clap: :heart: :sparkles: :v: :zzz:
	icon :new: :ok: :cool: :vs: :tm: :warning: :wheelchair: :zap: :art: :bomb: :bulb: :key: :lock: :memo: :mag:
	item :book: :gift: :moneybag: :mega: :scissors: :hammer:
	device :computer: :iphone: :calling: :email:
	human :cop: :runner: :feet: :fist: :punch: :lipstick: :tophat:
	food :beer: :cake: :smoking:
	behicle :airplane: :bike: :bus: :ski: :taxi: :train:
	animal :bear: :fish: :octocat:
	nature :fire: :leaves: :star: :sunny:

	// convert 0..255 R,G,B values to binary string
	RGBToBin = function(r,g,b){
	var bin = r << 16 \| g << 8 \| b;
	return (function(h){
	return new Array(25-h.length).join("0")+h
	})(bin.toString(2))
	}

	// convert 0..255 R,G,B values to a hexidecimal color string
	RGBToHex = function(r,g,b){

	var parser = document.createElement('a');
	parser.href = "http://example.com:3000/pathname/?search=test#hash";

	parser.protocol; // => "http:"
	parser.hostname; // => "example.com"
	parser.port; // => "3000"
	parser.pathname; // => "/pathname/"
	parser.search; // => "?search=test"
	parser.hash; // => "#hash"
	parser.host; // => "example.com:3000"

	// ES6 version using asynchronous iterators, compatible with node v10.0+

	const fs = require("fs");
	const path = require("path");

	async function* walk(dir) {
	for await (const d of await fs.promises.opendir(dir)) {
	const entry = path.join(dir, d.name);
	if (d.isDirectory()) yield* walk(entry);
	else if (d.isFile()) yield entry;

	// Copy the following into Preferences > Key Bindings -- User
	// Thanks to:
	// http://sublimetext.userecho.com/topic/86166-backtick-quoting-selected-text-does-not-work-like-single-quotes-and-double-quotes/

	[
	// Auto-pair backticks
	{ "keys": ["`"], "command": "insert_snippet", "args": {"contents": "`$0`"}, "context":
	[
	{ "key": "setting.auto_match_enabled", "operator": "equal", "operand": true },
	{ "key": "selection_empty", "operator": "equal", "operand": true, "match_all": true },


	<!DOCTYPE html>
	<html>
	<head>
	<script src="http://cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.min.js"></script>
	<meta charset="utf-8">
	<title>JS Bin</title>
	</head>
	<body>
	<div data-component="input">