Skip to content

Instantly share code, notes, and snippets.

Everything I Know About UI Routing

Definitions

  1. Location - The location of the application. Usually just a URL, but the location can contain multiple pieces of information that can be used by an app
    1. pathname - The "file/directory" portion of the URL, like invoices/123
    2. search - The stuff after ? in a URL like /assignments?showGrades=1.
    3. query - A parsed version of search, usually an object but not a standard browser feature.
    4. hash - The # portion of the URL. This is not available to servers in request.url so its client only. By default it means which part of the page the user should be scrolled to, but developers use it for various things.
    5. state - Object associated with a location. Think of it like a hidden URL query. It's state you want to keep with a specific location, but you don't want it to be visible in the URL.
@vire
vire / .flowconfig
Created March 9, 2017 14:44 — forked from MoOx/.flowconfig
flow config webpack adjustements to avoid the "Required module not found" for png, css, svg etcc
# ...
[options]
# webpack loaders
module.name_mapper='.*\.css$' -> '<PROJECT_ROOT>/flow/stub/css-modules.js'
module.name_mapper='.*\.\(svg\|png\|jpg\|gif\)$' -> '<PROJECT_ROOT>/flow/stub/url-loader.js'
[
[:app "cmd-t" :workspace.show]
[:app "cmd-shift-f" :searcher.show]
[:app "cmd-shift-k" :clear-console]
[:app "cmd-shift-s" :save-all]
[:app "cmd-ctrl-f" :window.fullscreen]
[:app "cmd-k" :toggle-console]
[:app "tab" :focus-last-editor]
[:workspace.focused "enter" :lt.plugins.workspace-nav/open-selection]
@vire
vire / introrx.md
Last active August 29, 2015 14:23 — forked from staltz/introrx.md

The introduction to Reactive Programming you've been missing

(by @andrestaltz)

So you're curious in learning this new thing called Reactive Programming, particularly its variant comprising of Rx, Bacon.js, RAC, and others.

Learning it is hard, even harder by the lack of good material. When I started, I tried looking for tutorials. I found only a handful of practical guides, but they just scratched the surface and never tackled the challenge of building the whole architecture around it. Library documentations often don't help when you're trying to understand some function. I mean, honestly, look at this:

Rx.Observable.prototype.flatMapLatest(selector, [thisArg])

Projects each element of an observable sequence into a new sequence of observable sequences by incorporating the element's index and then transforms an observable sequence of observable sequences into an observable sequence producing values only from the most recent observable sequence.

@vire
vire / q_example.js
Last active August 29, 2015 14:06 — forked from Heshyo/q_example.js
// Q sample by Jeff Cogswell
/*===========
We want to call these three functions in sequence, one after the other:
First we want to call one, which initiates an ajax call. Once that ajax call
is complete, we want to call two. Once two's ajax call is complete, we want to call three.
BUT, we don't want to just call our three functions in sequence, as this quick
demo will show. Look at this sample function and think about what order
// Q sample by Jeff Cogswell
/*===========
We want to call these three functions in sequence, one after the other:
First we want to call one, which initiates an ajax call. Once that
ajax call is complete, we want to call two. Once two's ajax call is
complete, we want to call three.
BUT, we don't want to just call our three functions in sequence, as this quick
/**
* Custom data adapter
*
* Adapter delegates request methods to the entity resolver, rather than a regular ajax request.
* Add/edit/delete methods are suppressed for this implementation but could easily be enabled
*
***/
module.exports = DS.Adapter.extend({
This file has been truncated, but you can view the full file.
{"sample_rate": 48000, "samples_per_pixel": 512, "bits": 8, "size": 251708, "data": [0,0,0,0,0,0,0,0,-3,3,-3,2,-19,21,-22,19,-34,34,-33,32,-35,29,-28,28,-27,29,-27,24,-11,9,-2,2,-9,6,-16,14,-28,32,-30,22,-51,42,-40,34,-48,34,-43,32,-43,30,-47,32,-18,15,-7,5,-3,6,-5,5,-2,3,-5,13,-6,15,-1,1,-3,7,-19,30,-34,38,-42,42,-41,41,-40,43,-26,25,-13,14,-8,10,-11,8,-19,18,-13,13,-9,10,-11,11,-23,35,-25,30,-35,43,-47,53,-43,36,-42,49,-41,37,-41,44,-43,45,-44,37,-38,35,-41,36,-41,38,-39,42,-35,46,-37,43,-37,44,-29,46,-27,48,-29,44,-29,44,-30,42,-35,46,-40,37,-38,42,-36,44,-32,45,-36,39,-39,38,-36,34,-22,23,-25,18,-26,30,-24,21,-29,28,-20,22,-16,16,-5,5,-2,2,0,0,-1,1,-15,14,-20,23,-26,25,-28,27,-33,24,-23,18,-10,11,-7,7,-5,3,-8,6,-20,19,-29,25,-36,37,-38,38,-38,39,-43,39,-35,30,-39,32,-39,28,-37,29,-34,25,-28,15,-19,15,-10,12,-5,7,-6,7,-16,20,-11,14,-25,26,-34,24,-25,22,-18,18,-6,5,-5,5,-20,13,-14,16,-12,8,-5,6,-12,12,-27,25,-33,40,-32,44,-31,44,-27,42,-25,40,-21,33,-15,25,-11,16,-9,10,-7,6,-5,5,-4,5,-6,15,-15,20,-26,23,-29
// ----------------------------------------------------------
// A short snippet for detecting versions of IE in JavaScript
// without resorting to user-agent sniffing
// ----------------------------------------------------------
// If you're not in IE (or IE version is less than 5) then:
// ie === undefined
// If you're in IE (>=5) then you can determine which version:
// ie === 7; // IE7
// Thus, to detect IE:
// if (ie) {}