` tags in the HTML output. For example, this input:
+
+ * Bird
+ * Magic
+
+will turn into:
+
+
+
+
+It's worth noting that it's possible to trigger an ordered list by
+accident, by writing something like this:
+
+ 1986. What a great season.
+
+In other words, a *number-period-space* sequence at the beginning of a
+line. To avoid this, you can backslash-escape the period:
+
+ 1986\. What a great season.
+
+
+
+Code Blocks
+
+Pre-formatted code blocks are used for writing about programming or
+markup source code. Rather than forming normal paragraphs, the lines
+of a code block are interpreted literally. Markdown wraps a code block
+in both `` and `` tags.
+
+To produce a code block in Markdown, simply indent every line of the
+block by at least 4 spaces or 1 tab. For example, given this input:
+
+ This is a normal paragraph:
+
+ This is a code block.
+
+Markdown will generate:
+
+ This is a normal paragraph:
+
+ This is a code block.
+ Here is an example of AppleScript:
+
+ tell application "Foo"
+ beep
+ end tell
+ <div class="footer">
+ © 2004 Foo Corporation
+ </div>
+ Horizontal Rules
+
+You can produce a horizontal rule tag (`Span Elements
+
+Links
+
+Markdown supports two style of links: *inline* and *reference*.
+
+In both styles, the link text is delimited by [square brackets].
+
+To create an inline link, use a set of regular parentheses immediately
+after the link text's closing square bracket. Inside the parentheses,
+put the URL where you want the link to point, along with an *optional*
+title for the link, surrounded in quotes. For example:
+
+ This is [an example](http://example.com/ "Title") inline link.
+
+ [This link](http://example.net/) has no title attribute.
+
+Will produce:
+
+ This is
+ an example inline link.
+
+ This link has no
+ title attribute.
+
+If you're referring to a local resource on the same server, you can
+use relative paths:
+
+ See my [About](/about/) page for details.
+
+Reference-style links use a second set of square brackets, inside
+which you place a label of your choosing to identify the link:
+
+ This is [an example][id] reference-style link.
+
+You can optionally use a space to separate the sets of brackets:
+
+ This is [an example] [id] reference-style link.
+
+Then, anywhere in the document, you define your link label like this,
+on a line by itself:
+
+ [id]: http://example.com/ "Optional Title Here"
+
+That is:
+
+* Square brackets containing the link identifier (optionally
+ indented from the left margin using up to three spaces);
+* followed by a colon;
+* followed by one or more spaces (or tabs);
+* followed by the URL for the link;
+* optionally followed by a title attribute for the link, enclosed
+ in double or single quotes.
+
+The link URL may, optionally, be surrounded by angle brackets:
+
+ [id]: I get 10 times more traffic from Google than from
+ Yahoo
+ or MSN .
+
+For comparison, here is the same paragraph written using
+Markdown's inline link style:
+
+ I get 10 times more traffic from [Google](http://google.com/ "Google")
+ than from [Yahoo](http://search.yahoo.com/ "Yahoo Search") or
+ [MSN](http://search.msn.com/ "MSN Search").
+
+The point of reference-style links is not that they're easier to
+write. The point is that with reference-style links, your document
+source is vastly more readable. Compare the above examples: using
+reference-style links, the paragraph itself is only 81 characters
+long; with inline-style links, it's 176 characters; and as raw HTML,
+it's 234 characters. In the raw HTML, there's more markup than there
+is text.
+
+With Markdown's reference-style links, a source document much more
+closely resembles the final output, as rendered in a browser. By
+allowing you to move the markup-related metadata out of the paragraph,
+you can add links without interrupting the narrative flow of your
+prose.
+
+
+Emphasis
+
+Markdown treats asterisks (`*`) and underscores (`_`) as indicators of
+emphasis. Text wrapped with one `*` or `_` will be wrapped with an
+HTML `` tag; double `*`'s or `_`'s will be wrapped with an HTML
+`` tag. E.g., this input:
+
+ *single asterisks*
+
+ _single underscores_
+
+ **double asterisks**
+
+ __double underscores__
+
+will produce:
+
+ single asterisks
+
+ single underscores
+
+ double asterisks
+
+ double underscores
+
+You can use whichever style you prefer; the lone restriction is that
+the same character must be used to open and close an emphasis span.
+
+Emphasis can be used in the middle of a word:
+
+ un*fucking*believable
+
+But if you surround an `*` or `_` with spaces, it'll be treated as a
+literal asterisk or underscore.
+
+To produce a literal asterisk or underscore at a position where it
+would otherwise be used as an emphasis delimiter, you can backslash
+escape it:
+
+ \*this text is surrounded by literal asterisks\*
+
+
+
+Code
+
+To indicate a span of code, wrap it with backtick quotes (`` ` ``).
+Unlike a pre-formatted code block, a code span indicates code within a
+normal paragraph. For example:
+
+ Use the `printf()` function.
+
+will produce:
+
+ Use the printf() function.
+
+To include a literal backtick character within a code span, you can use
+multiple backticks as the opening and closing delimiters:
+
+ ``There is a literal backtick (`) here.``
+
+which will produce this:
+
+ There is a literal backtick (`) here.
+
+The backtick delimiters surrounding a code span may include spaces --
+one after the opening, one before the closing. This allows you to place
+literal backtick characters at the beginning or end of a code span:
+
+ A single backtick in a code span: `` ` ``
+
+ A backtick-delimited string in a code span: `` `foo` ``
+
+will produce:
+
+ A single backtick in a code span: `
+
+ A backtick-delimited string in a code span: `foo`
+
+With a code span, ampersands and angle brackets are encoded as HTML
+entities automatically, which makes it easy to include example HTML
+tags. Markdown will turn this:
+
+ Please don't use any `` tags.
+
+into:
+
+ Please don't use any <blink> tags.
+
+You can write this:
+
+ `—` is the decimal-encoded equivalent of `—`.
+
+to produce:
+
+ — is the decimal-encoded
+ equivalent of —.
+
+
+
+Images
+
+Admittedly, it's fairly difficult to devise a "natural" syntax for
+placing images into a plain text document format.
+
+Markdown uses an image syntax that is intended to resemble the syntax
+for links, allowing for two styles: *inline* and *reference*.
+
+Inline image syntax looks like this:
+
+ 
+
+ 
+
+That is:
+
+* An exclamation mark: `!`;
+* followed by a set of square brackets, containing the `alt`
+ attribute text for the image;
+* followed by a set of parentheses, containing the URL or path to
+ the image, and an optional `title` attribute enclosed in double
+ or single quotes.
+
+Reference-style image syntax looks like this:
+
+ ![Alt text][id]
+
+Where "id" is the name of a defined image reference. Image references
+are defined using syntax identical to link references:
+
+ [id]: url/to/image "Optional title attribute"
+
+As of this writing, Markdown has no syntax for specifying the
+dimensions of an image; if this is important to you, you can simply
+use regular HTML `Miscellaneous
+
+Automatic Links
+
+Markdown supports a shortcut style for creating "automatic" links for URLs and email addresses: simply surround the URL or email address with angle brackets. What this means is that if you want to show the actual text of a URL or email address, and also have it be a clickable link, you can do this:
+
+ http://example.com/
+
+Automatic links for email addresses work similarly, except that
+Markdown will also perform a bit of randomized decimal and hex
+entity-encoding to help obscure your address from address-harvesting
+spambots. For example, Markdown will turn this:
+
+
+
+into something like this:
+
+ address@exa
+ mple.com
+
+which will render in a browser as a clickable link to "address@example.com".
+
+(This sort of entity-encoding trick will indeed fool many, if not
+most, address-harvesting bots, but it definitely won't fool all of
+them. It's better than nothing, but an address published in this way
+will probably eventually start receiving spam.)
+
+
+
+Backslash Escapes
+
+Markdown allows you to use backslash escapes to generate literal
+characters which would otherwise have special meaning in Markdown's
+formatting syntax. For example, if you wanted to surround a word with
+literal asterisks (instead of an HTML `` tag), you can backslashes
+before the asterisks, like this:
+
+ \*literal asterisks\*
+
+Markdown provides backslash escapes for the following characters:
+
+ \ backslash
+ ` backtick
+ * asterisk
+ _ underscore
+ {} curly braces
+ [] square brackets
+ () parentheses
+ # hash mark
+ + plus sign
+ - minus sign (hyphen)
+ . dot
+ ! exclamation mark
+
diff --git a/_site/app/bower_components/marked/test/tests/nested_blockquotes.html b/_site/app/bower_components/marked/test/tests/nested_blockquotes.html
new file mode 100644
index 0000000..d8ec7f8
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/nested_blockquotes.html
@@ -0,0 +1,9 @@
+
+ foo
+
+
+ bar
+
+
+ foo
+
diff --git a/_site/app/bower_components/marked/test/tests/nested_blockquotes.text b/_site/app/bower_components/marked/test/tests/nested_blockquotes.text
new file mode 100644
index 0000000..ed3c624
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/nested_blockquotes.text
@@ -0,0 +1,5 @@
+> foo
+>
+> > bar
+>
+> foo
diff --git a/_site/app/bower_components/marked/test/tests/nested_code.html b/_site/app/bower_components/marked/test/tests/nested_code.html
new file mode 100644
index 0000000..c370592
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/nested_code.html
@@ -0,0 +1 @@
+hi ther `` ok ```
diff --git a/_site/app/bower_components/marked/test/tests/nested_code.text b/_site/app/bower_components/marked/test/tests/nested_code.text
new file mode 100644
index 0000000..910e3d4
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/nested_code.text
@@ -0,0 +1 @@
+````` hi ther `` ok ``` `````
diff --git a/_site/app/bower_components/marked/test/tests/nested_em.html b/_site/app/bower_components/marked/test/tests/nested_em.html
new file mode 100644
index 0000000..3ab4ec8
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/nested_em.html
@@ -0,0 +1,3 @@
+test test test
+
+test test test
diff --git a/_site/app/bower_components/marked/test/tests/nested_em.text b/_site/app/bower_components/marked/test/tests/nested_em.text
new file mode 100644
index 0000000..550d0eb
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/nested_em.text
@@ -0,0 +1,3 @@
+*test **test** test*
+
+_test __test__ test_
diff --git a/_site/app/bower_components/marked/test/tests/nested_square_link.html b/_site/app/bower_components/marked/test/tests/nested_square_link.html
new file mode 100644
index 0000000..c8b7940
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/nested_square_link.html
@@ -0,0 +1 @@
+the ] character
diff --git a/_site/app/bower_components/marked/test/tests/nested_square_link.text b/_site/app/bower_components/marked/test/tests/nested_square_link.text
new file mode 100644
index 0000000..82226ed
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/nested_square_link.text
@@ -0,0 +1 @@
+[the `]` character](/url)
diff --git a/_site/app/bower_components/marked/test/tests/not_a_link.html b/_site/app/bower_components/marked/test/tests/not_a_link.html
new file mode 100644
index 0000000..a01685d
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/not_a_link.html
@@ -0,0 +1 @@
+[test](not a link)
diff --git a/_site/app/bower_components/marked/test/tests/not_a_link.text b/_site/app/bower_components/marked/test/tests/not_a_link.text
new file mode 100644
index 0000000..26f6043
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/not_a_link.text
@@ -0,0 +1 @@
+\[test](not a link)
diff --git a/_site/app/bower_components/marked/test/tests/ordered_and_unordered_lists.html b/_site/app/bower_components/marked/test/tests/ordered_and_unordered_lists.html
new file mode 100644
index 0000000..3ab6122
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/ordered_and_unordered_lists.html
@@ -0,0 +1,148 @@
+Unordered
+
+Asterisks tight:
+
+
+asterisk 1
+asterisk 2
+asterisk 3
+
+
+Asterisks loose:
+
+
+asterisk 1
asterisk 2
asterisk 3
+
+Pluses tight:
+
+
+Plus 1
+Plus 2
+Plus 3
+
+
+Pluses loose:
+
+
+Plus 1
Plus 2
Plus 3
+
+Minuses tight:
+
+
+Minus 1
+Minus 2
+Minus 3
+
+
+Minuses loose:
+
+
+Minus 1
Minus 2
Minus 3
+
+Ordered
+
+Tight:
+
+
+First
+Second
+Third
+
+
+and:
+
+
+One
+Two
+Three
+
+
+Loose using tabs:
+
+
+First
Second
Third
+
+and using spaces:
+
+
+One
Two
Three
+
+Multiple paragraphs:
+
+
+Item 1, graf one.
+
+Item 2. graf two. The quick brown fox jumped over the lazy dog's
+back.
Item 2.
Item 3.
+
+Nested
+
+
+
+Here's another:
+
+
+First
+Second:
+
+Third
+
+
+Same thing but with paragraphs:
+
+
+First
Second:
+
+Third
+
+
+This was an error in Markdown 1.0.1:
+
+
diff --git a/_site/app/bower_components/marked/test/tests/ordered_and_unordered_lists.text b/_site/app/bower_components/marked/test/tests/ordered_and_unordered_lists.text
new file mode 100644
index 0000000..7f3b497
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/ordered_and_unordered_lists.text
@@ -0,0 +1,131 @@
+## Unordered
+
+Asterisks tight:
+
+* asterisk 1
+* asterisk 2
+* asterisk 3
+
+
+Asterisks loose:
+
+* asterisk 1
+
+* asterisk 2
+
+* asterisk 3
+
+* * *
+
+Pluses tight:
+
++ Plus 1
++ Plus 2
++ Plus 3
+
+
+Pluses loose:
+
++ Plus 1
+
++ Plus 2
+
++ Plus 3
+
+* * *
+
+
+Minuses tight:
+
+- Minus 1
+- Minus 2
+- Minus 3
+
+
+Minuses loose:
+
+- Minus 1
+
+- Minus 2
+
+- Minus 3
+
+
+## Ordered
+
+Tight:
+
+1. First
+2. Second
+3. Third
+
+and:
+
+1. One
+2. Two
+3. Three
+
+
+Loose using tabs:
+
+1. First
+
+2. Second
+
+3. Third
+
+and using spaces:
+
+1. One
+
+2. Two
+
+3. Three
+
+Multiple paragraphs:
+
+1. Item 1, graf one.
+
+ Item 2. graf two. The quick brown fox jumped over the lazy dog's
+ back.
+
+2. Item 2.
+
+3. Item 3.
+
+
+
+## Nested
+
+* Tab
+ * Tab
+ * Tab
+
+Here's another:
+
+1. First
+2. Second:
+ * Fee
+ * Fie
+ * Foe
+3. Third
+
+Same thing but with paragraphs:
+
+1. First
+
+2. Second:
+ * Fee
+ * Fie
+ * Foe
+
+3. Third
+
+
+This was an error in Markdown 1.0.1:
+
+* this
+
+ * sub
+
+ that
diff --git a/_site/app/bower_components/marked/test/tests/ref_paren.html b/_site/app/bower_components/marked/test/tests/ref_paren.html
new file mode 100644
index 0000000..cff6977
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/ref_paren.html
@@ -0,0 +1 @@
+hi
diff --git a/_site/app/bower_components/marked/test/tests/ref_paren.text b/_site/app/bower_components/marked/test/tests/ref_paren.text
new file mode 100644
index 0000000..aa97c91
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/ref_paren.text
@@ -0,0 +1,3 @@
+[hi]
+
+[hi]: /url (there)
diff --git a/_site/app/bower_components/marked/test/tests/same_bullet.html b/_site/app/bower_components/marked/test/tests/same_bullet.html
new file mode 100644
index 0000000..9220741
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/same_bullet.html
@@ -0,0 +1,5 @@
+
diff --git a/_site/app/bower_components/marked/test/tests/same_bullet.text b/_site/app/bower_components/marked/test/tests/same_bullet.text
new file mode 100644
index 0000000..27a8967
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/same_bullet.text
@@ -0,0 +1,3 @@
+* test
++ test
+- test
diff --git a/_site/app/bower_components/marked/test/tests/strong_and_em_together.html b/_site/app/bower_components/marked/test/tests/strong_and_em_together.html
new file mode 100644
index 0000000..71ec78c
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/strong_and_em_together.html
@@ -0,0 +1,7 @@
+This is strong and em.
+
+So is this
+
+This is strong and em.
+
+So is this
diff --git a/_site/app/bower_components/marked/test/tests/strong_and_em_together.text b/_site/app/bower_components/marked/test/tests/strong_and_em_together.text
new file mode 100644
index 0000000..95ee690
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/strong_and_em_together.text
@@ -0,0 +1,7 @@
+***This is strong and em.***
+
+So is ***this*** word.
+
+___This is strong and em.___
+
+So is ___this___ word.
diff --git a/_site/app/bower_components/marked/test/tests/tabs.html b/_site/app/bower_components/marked/test/tests/tabs.html
new file mode 100644
index 0000000..3301ba8
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/tabs.html
@@ -0,0 +1,25 @@
+
+
+Code:
+
+this code block is indented by one tab
+And:
+
+ this code block is indented by two tabs
+And:
+
++ this is an example list item
+ indented with tabs
+
++ this is an example list item
+ indented with spaces
+Hello world ‘how’ “are” you — today…
+
+“It’s a more ‘challenging’ smartypants test…”
+
+‘And,’ as a bonus — “one
+multiline” test!
diff --git a/_site/app/bower_components/marked/test/tests/text.smartypants.text b/_site/app/bower_components/marked/test/tests/text.smartypants.text
new file mode 100644
index 0000000..d91c8dc
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/text.smartypants.text
@@ -0,0 +1,6 @@
+Hello world 'how' "are" you -- today...
+
+"It's a more 'challenging' smartypants test..."
+
+'And,' as a bonus -- "one
+multiline" test!
diff --git a/_site/app/bower_components/marked/test/tests/tidyness.html b/_site/app/bower_components/marked/test/tests/tidyness.html
new file mode 100644
index 0000000..f2a8ce7
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/tidyness.html
@@ -0,0 +1,8 @@
+
+A list within a blockquote:
+
+asterisk 1
+asterisk 2
+asterisk 3
+
+
diff --git a/_site/app/bower_components/marked/test/tests/tidyness.text b/_site/app/bower_components/marked/test/tests/tidyness.text
new file mode 100644
index 0000000..5f18b8d
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/tidyness.text
@@ -0,0 +1,5 @@
+> A list within a blockquote:
+>
+> * asterisk 1
+> * asterisk 2
+> * asterisk 3
diff --git a/_site/app/bower_components/marked/test/tests/toplevel_paragraphs.gfm.html b/_site/app/bower_components/marked/test/tests/toplevel_paragraphs.gfm.html
new file mode 100644
index 0000000..970c6f1
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/toplevel_paragraphs.gfm.html
@@ -0,0 +1,34 @@
+hello world
+ how are you
+ how are you
+
+hello world
+how are youhello world
+hello world
+how are you
+
+hello world
+how are you
+
+hello world
+how are you
hello world
+
+
+hello world
+how are you
+
+hello world
+how are you
+
+hello world
+
+
+hello
+
+hello
diff --git a/_site/app/bower_components/marked/test/tests/toplevel_paragraphs.gfm.text b/_site/app/bower_components/marked/test/tests/toplevel_paragraphs.gfm.text
new file mode 100644
index 0000000..66366c0
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/toplevel_paragraphs.gfm.text
@@ -0,0 +1,37 @@
+hello world
+ how are you
+ how are you
+
+hello world
+```
+how are you
+```
+
+hello world
+* * *
+
+hello world
+# how are you
+
+hello world
+how are you
+===========
+
+hello world
+> how are you
+
+hello world
+* how are you
+
+hello world
+how are you
+
+hello world
+how are you
+
+hello [world][how]
+[how]: /are/you
+
+hello
+
+hello
diff --git a/_site/app/bower_components/marked/test/tests/tricky_list.html b/_site/app/bower_components/marked/test/tests/tricky_list.html
new file mode 100644
index 0000000..764a335
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/tricky_list.html
@@ -0,0 +1,23 @@
+hello world
+
+
+
+hello world
+
+
+
+hello world
+
+
+
+hello world
+
+
diff --git a/_site/app/bower_components/marked/test/tests/tricky_list.text b/_site/app/bower_components/marked/test/tests/tricky_list.text
new file mode 100644
index 0000000..9aa76ce
--- /dev/null
+++ b/_site/app/bower_components/marked/test/tests/tricky_list.text
@@ -0,0 +1,15 @@
+**hello** _world_
+
+* hello world
+
+**hello** _world_
+
+* hello world
+
+**hello** _world_
+
+* Hello world
+
+**hello** _world_
+
+* hello world
diff --git a/_site/app/bower_components/normalize-css/LICENSE.md b/_site/app/bower_components/normalize-css/LICENSE.md
new file mode 100644
index 0000000..c6bcc9b
--- /dev/null
+++ b/_site/app/bower_components/normalize-css/LICENSE.md
@@ -0,0 +1,19 @@
+Copyright (c) Nicolas Gallagher and Jonathan Neal
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of
+this software and associated documentation files (the "Software"), to deal in
+the Software without restriction, including without limitation the rights to
+use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
+of the Software, and to permit persons to whom the Software is furnished to do
+so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
diff --git a/_site/app/bower_components/normalize-css/README.md b/_site/app/bower_components/normalize-css/README.md
new file mode 100644
index 0000000..80ec51a
--- /dev/null
+++ b/_site/app/bower_components/normalize-css/README.md
@@ -0,0 +1,57 @@
+# normalize.css v3
+
+Normalize.css is a customisable CSS file that makes browsers render all
+elements more consistently and in line with modern standards.
+
+The project relies on researching the differences between default browser
+styles in order to precisely target only the styles that need or benefit from
+normalizing.
+
+[View the test file](http://necolas.github.io/normalize.css/latest/test.html)
+
+## Install
+
+Download from the [project page](http://necolas.github.io/normalize.css/).
+
+Install with [Component(1)](https://github.com/component/component/): `component install necolas/normalize.css`
+
+Install with [npm](http://npmjs.org/): `npm install --save normalize.css`
+
+Install with [Bower](http://bower.io/): `bower install --save normalize.css`
+
+## What does it do?
+
+* Preserves useful defaults, unlike many CSS resets.
+* Normalizes styles for a wide range of elements.
+* Corrects bugs and common browser inconsistencies.
+* Improves usability with subtle improvements.
+* Explains what code does using detailed comments.
+
+## How to use it
+
+No other styles should come before Normalize.css.
+
+It is recommended that you include the `normalize.css` file as untouched
+library code.
+
+## Browser support
+
+* Google Chrome (latest)
+* Mozilla Firefox (latest)
+* Mozilla Firefox 4
+* Opera (latest)
+* Apple Safari 6+
+* Internet Explorer 8+
+
+[Normalize.css v1 provides legacy browser
+support](https://github.com/necolas/normalize.css/tree/v1) (IE 6+, Safari 4+),
+but is no longer actively developed.
+
+## Contributing
+
+Please read the CONTRIBUTING.md
+
+## Acknowledgements
+
+Normalize.css is a project by [Nicolas Gallagher](https://github.com/necolas),
+co-created with [Jonathan Neal](https://github.com/jonathantneal).
diff --git a/_site/app/bower_components/normalize-css/bower.json b/_site/app/bower_components/normalize-css/bower.json
new file mode 100644
index 0000000..9ddcdd0
--- /dev/null
+++ b/_site/app/bower_components/normalize-css/bower.json
@@ -0,0 +1,13 @@
+{
+ "name": "normalize-css",
+ "version": "3.0.1",
+ "main": "normalize.css",
+ "author": "Nicolas Gallagher",
+ "ignore": [
+ "CHANGELOG.md",
+ "CONTRIBUTING.md",
+ "component.json",
+ "package.json",
+ "test.html"
+ ]
+}
diff --git a/_site/app/bower_components/normalize-css/normalize.css b/_site/app/bower_components/normalize-css/normalize.css
new file mode 100644
index 0000000..08f8950
--- /dev/null
+++ b/_site/app/bower_components/normalize-css/normalize.css
@@ -0,0 +1,425 @@
+/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
+
+/**
+ * 1. Set default font family to sans-serif.
+ * 2. Prevent iOS text size adjust after orientation change, without disabling
+ * user zoom.
+ */
+
+html {
+ font-family: sans-serif; /* 1 */
+ -ms-text-size-adjust: 100%; /* 2 */
+ -webkit-text-size-adjust: 100%; /* 2 */
+}
+
+/**
+ * Remove default margin.
+ */
+
+body {
+ margin: 0;
+}
+
+/* HTML5 display definitions
+ ========================================================================== */
+
+/**
+ * Correct `block` display not defined for any HTML5 element in IE 8/9.
+ * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.
+ * Correct `block` display not defined for `main` in IE 11.
+ */
+
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+main,
+nav,
+section,
+summary {
+ display: block;
+}
+
+/**
+ * 1. Correct `inline-block` display not defined in IE 8/9.
+ * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
+ */
+
+audio,
+canvas,
+progress,
+video {
+ display: inline-block; /* 1 */
+ vertical-align: baseline; /* 2 */
+}
+
+/**
+ * Prevent modern browsers from displaying `audio` without controls.
+ * Remove excess height in iOS 5 devices.
+ */
+
+audio:not([controls]) {
+ display: none;
+ height: 0;
+}
+
+/**
+ * Address `[hidden]` styling not present in IE 8/9/10.
+ * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
+ */
+
+[hidden],
+template {
+ display: none;
+}
+
+/* Links
+ ========================================================================== */
+
+/**
+ * Remove the gray background color from active links in IE 10.
+ */
+
+a {
+ background: transparent;
+}
+
+/**
+ * Improve readability when focused and also mouse hovered in all browsers.
+ */
+
+a:active,
+a:hover {
+ outline: 0;
+}
+
+/* Text-level semantics
+ ========================================================================== */
+
+/**
+ * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
+ */
+
+abbr[title] {
+ border-bottom: 1px dotted;
+}
+
+/**
+ * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
+ */
+
+b,
+strong {
+ font-weight: bold;
+}
+
+/**
+ * Address styling not present in Safari and Chrome.
+ */
+
+dfn {
+ font-style: italic;
+}
+
+/**
+ * Address variable `h1` font-size and margin within `section` and `article`
+ * contexts in Firefox 4+, Safari, and Chrome.
+ */
+
+h1 {
+ font-size: 2em;
+ margin: 0.67em 0;
+}
+
+/**
+ * Address styling not present in IE 8/9.
+ */
+
+mark {
+ background: #ff0;
+ color: #000;
+}
+
+/**
+ * Address inconsistent and variable font size in all browsers.
+ */
+
+small {
+ font-size: 80%;
+}
+
+/**
+ * Prevent `sub` and `sup` affecting `line-height` in all browsers.
+ */
+
+sub,
+sup {
+ font-size: 75%;
+ line-height: 0;
+ position: relative;
+ vertical-align: baseline;
+}
+
+sup {
+ top: -0.5em;
+}
+
+sub {
+ bottom: -0.25em;
+}
+
+/* Embedded content
+ ========================================================================== */
+
+/**
+ * Remove border when inside `a` element in IE 8/9/10.
+ */
+
+img {
+ border: 0;
+}
+
+/**
+ * Correct overflow not hidden in IE 9/10/11.
+ */
+
+svg:not(:root) {
+ overflow: hidden;
+}
+
+/* Grouping content
+ ========================================================================== */
+
+/**
+ * Address margin not present in IE 8/9 and Safari.
+ */
+
+figure {
+ margin: 1em 40px;
+}
+
+/**
+ * Address differences between Firefox and other browsers.
+ */
+
+hr {
+ -moz-box-sizing: content-box;
+ box-sizing: content-box;
+ height: 0;
+}
+
+/**
+ * Contain overflow in all browsers.
+ */
+
+pre {
+ overflow: auto;
+}
+
+/**
+ * Address odd `em`-unit font size rendering in all browsers.
+ */
+
+code,
+kbd,
+pre,
+samp {
+ font-family: monospace, monospace;
+ font-size: 1em;
+}
+
+/* Forms
+ ========================================================================== */
+
+/**
+ * Known limitation: by default, Chrome and Safari on OS X allow very limited
+ * styling of `select`, unless a `border` property is set.
+ */
+
+/**
+ * 1. Correct color not being inherited.
+ * Known issue: affects color of disabled elements.
+ * 2. Correct font properties not being inherited.
+ * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
+ */
+
+button,
+input,
+optgroup,
+select,
+textarea {
+ color: inherit; /* 1 */
+ font: inherit; /* 2 */
+ margin: 0; /* 3 */
+}
+
+/**
+ * Address `overflow` set to `hidden` in IE 8/9/10/11.
+ */
+
+button {
+ overflow: visible;
+}
+
+/**
+ * Address inconsistent `text-transform` inheritance for `button` and `select`.
+ * All other form control elements do not inherit `text-transform` values.
+ * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
+ * Correct `select` style inheritance in Firefox.
+ */
+
+button,
+select {
+ text-transform: none;
+}
+
+/**
+ * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
+ * and `video` controls.
+ * 2. Correct inability to style clickable `input` types in iOS.
+ * 3. Improve usability and consistency of cursor style between image-type
+ * `input` and others.
+ */
+
+button,
+html input[type="button"], /* 1 */
+input[type="reset"],
+input[type="submit"] {
+ -webkit-appearance: button; /* 2 */
+ cursor: pointer; /* 3 */
+}
+
+/**
+ * Re-set default cursor for disabled elements.
+ */
+
+button[disabled],
+html input[disabled] {
+ cursor: default;
+}
+
+/**
+ * Remove inner padding and border in Firefox 4+.
+ */
+
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+ border: 0;
+ padding: 0;
+}
+
+/**
+ * Address Firefox 4+ setting `line-height` on `input` using `!important` in
+ * the UA stylesheet.
+ */
+
+input {
+ line-height: normal;
+}
+
+/**
+ * It's recommended that you don't attempt to style these elements.
+ * Firefox's implementation doesn't respect box-sizing, padding, or width.
+ *
+ * 1. Address box sizing set to `content-box` in IE 8/9/10.
+ * 2. Remove excess padding in IE 8/9/10.
+ */
+
+input[type="checkbox"],
+input[type="radio"] {
+ box-sizing: border-box; /* 1 */
+ padding: 0; /* 2 */
+}
+
+/**
+ * Fix the cursor style for Chrome's increment/decrement buttons. For certain
+ * `font-size` values of the `input`, it causes the cursor style of the
+ * decrement button to change from `default` to `text`.
+ */
+
+input[type="number"]::-webkit-inner-spin-button,
+input[type="number"]::-webkit-outer-spin-button {
+ height: auto;
+}
+
+/**
+ * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
+ * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
+ * (include `-moz` to future-proof).
+ */
+
+input[type="search"] {
+ -webkit-appearance: textfield; /* 1 */
+ -moz-box-sizing: content-box;
+ -webkit-box-sizing: content-box; /* 2 */
+ box-sizing: content-box;
+}
+
+/**
+ * Remove inner padding and search cancel button in Safari and Chrome on OS X.
+ * Safari (but not Chrome) clips the cancel button when the search input has
+ * padding (and `textfield` appearance).
+ */
+
+input[type="search"]::-webkit-search-cancel-button,
+input[type="search"]::-webkit-search-decoration {
+ -webkit-appearance: none;
+}
+
+/**
+ * Define consistent border, margin, and padding.
+ */
+
+fieldset {
+ border: 1px solid #c0c0c0;
+ margin: 0 2px;
+ padding: 0.35em 0.625em 0.75em;
+}
+
+/**
+ * 1. Correct `color` not being inherited in IE 8/9/10/11.
+ * 2. Remove padding so people aren't caught out if they zero out fieldsets.
+ */
+
+legend {
+ border: 0; /* 1 */
+ padding: 0; /* 2 */
+}
+
+/**
+ * Remove default vertical scrollbar in IE 8/9/10/11.
+ */
+
+textarea {
+ overflow: auto;
+}
+
+/**
+ * Don't inherit the `font-weight` (applied by a rule above).
+ * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
+ */
+
+optgroup {
+ font-weight: bold;
+}
+
+/* Tables
+ ========================================================================== */
+
+/**
+ * Remove most spacing between table cells.
+ */
+
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
+
+td,
+th {
+ padding: 0;
+}
diff --git a/_site/css/app.css b/_site/css/app.css
new file mode 100644
index 0000000..8a4b097
--- /dev/null
+++ b/_site/css/app.css
@@ -0,0 +1,423 @@
+/* General Setting */
+
+/* Small screens (default) */
+html { font-size: 100%; }
+
+/* Medium screens (640px) */
+@media (min-width: 40rem) {
+ html { font-size: 112%; }
+}
+
+/* Large screens (1024px) */
+@media (min-width: 64rem) {
+ html { font-size: 120%; }
+}
+
+/* Grid */
+
+/* Ditto */
+
+body {
+ color: #333;
+ margin: 0;
+ padding: 0;
+
+ font-family: Verdana, Arial;
+ font-size: 0.8rem;
+}
+
+#sidebar {
+ margin-top: 0;
+ padding-left: 25px;
+ padding-bottom:25px;
+ padding-top: 25px;
+
+ box-shadow: 0 0 40px #CCC;
+ -webkit-box-shadow: 0 0 40px #CCC;
+ -moz-box-shadow: 0 0 40px #CCC;
+ border-right: 1px solid #BBB;
+}
+
+@media (min-width: 40rem) {
+ #sidebar {
+ width: 280px;
+ position: fixed;
+ height: 100%;
+ margin-right: 20px;
+ padding-bottom:0px;
+ padding-top: 0px;
+ overflow-y: scroll;
+ overflow: -moz-scrollbars-vertical;
+ }
+}
+
+#sidebar h1 {
+ font-size: 25px;
+ margin-bottom: 0px;
+ padding-bottom: 0px;
+}
+
+#sidebar h1 a:link, #sidebar h1 a:visited {
+ color: #333;
+}
+
+#sidebar h2 {
+ font-size: 0.7rem;
+}
+
+#sidebar h5 {
+ margin-top: 20px;
+ margin-bottom: 0;
+}
+
+#sidebar a:visited, #sidebar a:link {
+ color: #4682BE;
+ text-decoration: none;
+}
+
+#sidebar ul {
+ list-style-type: none;
+ margin: 0;
+ padding-left: 10px;
+ padding-top: 0;
+}
+
+#sidebar ol {
+ margin: 0;
+ padding-left: 30px;
+ padding-top: 0;
+}
+
+#sidebar ul li:before { /* a hack to have dashes as a list style */
+ content: "-";
+ position: relative;
+ left: -5px;
+}
+
+#sidebar ul li,
+#sidebar ol li {
+ margin-top: 0;
+ margin-bottom: 0.2rem;
+ margin-left: 10px;
+ padding: 0;
+
+ text-indent: -5px; /* to compensate for the padding for the dash */
+ font-size: 0.7rem;
+}
+
+#content {
+ padding-top: 10px;
+ padding-bottom: 150px;
+ margin-left: 20px;
+ margin-right: 20px;
+ font-size: 0.8rem;
+ line-height:1.3rem;
+
+ /* border: 1px solid black; */
+}
+
+@media (min-width: 40rem) {
+ #content {
+ width: 580px;
+ padding-left:330px;
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+}
+
+#content pre{
+ margin-left: auto;
+ margin-right: auto;
+ padding-top: 10px;
+ padding-bottom: 10px;
+ padding-left: 0.7rem;
+ line-height: 1.2;
+
+ color: #FFF;
+
+ background: #111;
+ border-radius: 5px;
+}
+
+#content code {
+ padding-right: 5px;
+
+ color: #a6e22e;
+ font-size: 0.7rem;
+ font-weight: normal;
+ font-family: Consolas,"Courier New",Courier,FreeMono,monospace;
+
+ background: #111;
+ border-radius: 2px;
+}
+
+#content h2 {
+ margin-top: 50px;
+ margin-bottom: 0px;
+
+ padding-top: 20px;
+ padding-bottom: 0px;
+
+ font-size: 18px;
+ text-align: left;
+
+ border-top: 2px solid #666;
+}
+
+#content h3 {
+ margin-top: 50px;
+ margin-bottom: 0px;
+
+ padding-top: 20px;
+ padding-bottom: 0px;
+
+ text-align: left;
+ border-top: 1px dotted #777;
+}
+
+#content img {
+ max-width: 90%;
+ display: block;
+
+ margin-left: auto;
+ margin-right: auto;
+ margin-top: 40px;
+ margin-bottom: 40px;
+
+ border-radius: 5px;
+}
+
+#content ul {
+ display: block;
+ list-style-type: none;
+ padding-top: 0.5rem;
+ padding-bottom:0.5rem;
+}
+
+#content ol {
+ display: block;
+ padding-top: 0.5rem;
+ padding-bottom:0.5rem;
+}
+
+
+#content ul li:before { /* a hack to have dashes as a list style */
+ content: "-";
+ position: relative;
+ left: -5px;
+}
+
+#content ul li,
+#content ol li{
+ text-indent: -5px; /* to compensate for the padding for the dash */
+ font-size: 0.8rem;
+}
+
+#content ul li.link,
+#content ol li.link {
+ color: #2980b9;
+ text-decoration: none;
+ font-size: 0.7rem;
+ font-weight: bold;
+ cursor: pointer;
+}
+
+#content a:link, #content a:visited {
+ color: #4682BE;
+ text-decoration: none;
+}
+
+#content .content-toc{
+ background: #bdc3c7;
+ border-radius: 5px;
+}
+
+#back_to_top {
+ display: none;
+ position: fixed;
+
+ height: 20px;
+ width: 70px;
+ top: 20px;
+
+ margin-left: 930px;
+ margin-top: 0px;
+
+ color: #FFF;
+ line-height: 20px;
+ text-align: center;
+ font-size: 10px;
+
+
+ border-radius: 5px;
+ background-color: #AAA;
+}
+
+#back_to_top:hover {
+ background-color: #444;
+ cursor: pointer;
+}
+
+#edit {
+ display: none;
+ position: fixed;
+
+ height: 17px;
+ width: 70px;
+ top: 45px;
+
+ margin-left: 930px;
+ margin-top: 0px;
+
+ color: #FFF;
+ line-height: 17px;
+ text-align: center;
+ font-size: 10px;
+
+
+ border-radius: 5px;
+ background-color: #AAA;
+}
+
+#edit:hover {
+ background-color: #444;
+ cursor: pointer;
+}
+
+#loading, #error {
+ display: none;
+ position: fixed;
+
+ top: 0;
+ height: 17px;
+
+ font-size: 14px;
+}
+
+@media (min-width: 40rem) {
+ #loading, #error {
+ display: none;
+ position: fixed;
+
+ height: 17px;
+ top: 45%;
+
+ margin-left: 560px;
+
+ font-size: 14px;
+ }
+}
+
+/**
+ * okaidia theme for JavaScript, CSS and HTML
+ * Loosely based on Monokai textmate theme by http://www.monokai.nl/
+ * @author ocodia
+ */
+
+code[class*="language-"],
+pre[class*="language-"] {
+ color: #a6e22e;
+ text-shadow: 0 1px rgba(0,0,0,0.3);
+ font-family: Consolas, Monaco, 'Andale Mono', monospace;
+ direction: ltr;
+ text-align: left;
+ white-space: pre;
+ word-spacing: normal;
+ word-break: normal;
+
+ -moz-tab-size: 4;
+ -o-tab-size: 4;
+ tab-size: 4;
+
+ -webkit-hyphens: none;
+ -moz-hyphens: none;
+ -ms-hyphens: none;
+ hyphens: none;
+}
+
+/* Code blocks */
+pre[class*="language-"] {
+ padding: 1em;
+ margin: .5em 0;
+ overflow: auto;
+ border-radius: 0.3em;
+}
+
+:not(pre) > code[class*="language-"],
+pre[class*="language-"] {
+ background: #272822;
+}
+
+/* Inline code */
+:not(pre) > code[class*="language-"] {
+ padding: .1em;
+ border-radius: .3em;
+}
+
+.token.comment,
+.token.prolog,
+.token.doctype,
+.token.cdata {
+ color: #75715e;
+}
+
+.token.punctuation {
+ color: #f8f8f2;
+}
+
+.namespace {
+ opacity: .7;
+}
+
+.token.property,
+.token.tag,
+.token.constant,
+.token.symbol {
+ color: #f92672;
+}
+
+.token.boolean,
+.token.number{
+ color: #ae81ff;
+}
+
+.token.selector,
+.token.attr-name,
+.token.string,
+.token.builtin {
+ color: #a6e22e;
+}
+
+
+.token.operator,
+.token.entity,
+.token.url,
+.language-css .token.string,
+.style .token.string,
+.token.variable {
+ color: #f92672;
+}
+
+.token.atrule,
+.token.attr-value
+{
+ color: #e6db74;
+}
+
+
+.token.keyword{
+color: #66d9ef;
+}
+
+.token.regex,
+.token.important {
+ color: #fd971f;
+}
+
+.token.important {
+ font-weight: bold;
+}
+
+.token.entity {
+ cursor: help;
+}
diff --git a/_site/css/normalize.css b/_site/css/normalize.css
new file mode 100644
index 0000000..08f8950
--- /dev/null
+++ b/_site/css/normalize.css
@@ -0,0 +1,425 @@
+/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
+
+/**
+ * 1. Set default font family to sans-serif.
+ * 2. Prevent iOS text size adjust after orientation change, without disabling
+ * user zoom.
+ */
+
+html {
+ font-family: sans-serif; /* 1 */
+ -ms-text-size-adjust: 100%; /* 2 */
+ -webkit-text-size-adjust: 100%; /* 2 */
+}
+
+/**
+ * Remove default margin.
+ */
+
+body {
+ margin: 0;
+}
+
+/* HTML5 display definitions
+ ========================================================================== */
+
+/**
+ * Correct `block` display not defined for any HTML5 element in IE 8/9.
+ * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.
+ * Correct `block` display not defined for `main` in IE 11.
+ */
+
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+main,
+nav,
+section,
+summary {
+ display: block;
+}
+
+/**
+ * 1. Correct `inline-block` display not defined in IE 8/9.
+ * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
+ */
+
+audio,
+canvas,
+progress,
+video {
+ display: inline-block; /* 1 */
+ vertical-align: baseline; /* 2 */
+}
+
+/**
+ * Prevent modern browsers from displaying `audio` without controls.
+ * Remove excess height in iOS 5 devices.
+ */
+
+audio:not([controls]) {
+ display: none;
+ height: 0;
+}
+
+/**
+ * Address `[hidden]` styling not present in IE 8/9/10.
+ * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
+ */
+
+[hidden],
+template {
+ display: none;
+}
+
+/* Links
+ ========================================================================== */
+
+/**
+ * Remove the gray background color from active links in IE 10.
+ */
+
+a {
+ background: transparent;
+}
+
+/**
+ * Improve readability when focused and also mouse hovered in all browsers.
+ */
+
+a:active,
+a:hover {
+ outline: 0;
+}
+
+/* Text-level semantics
+ ========================================================================== */
+
+/**
+ * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
+ */
+
+abbr[title] {
+ border-bottom: 1px dotted;
+}
+
+/**
+ * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
+ */
+
+b,
+strong {
+ font-weight: bold;
+}
+
+/**
+ * Address styling not present in Safari and Chrome.
+ */
+
+dfn {
+ font-style: italic;
+}
+
+/**
+ * Address variable `h1` font-size and margin within `section` and `article`
+ * contexts in Firefox 4+, Safari, and Chrome.
+ */
+
+h1 {
+ font-size: 2em;
+ margin: 0.67em 0;
+}
+
+/**
+ * Address styling not present in IE 8/9.
+ */
+
+mark {
+ background: #ff0;
+ color: #000;
+}
+
+/**
+ * Address inconsistent and variable font size in all browsers.
+ */
+
+small {
+ font-size: 80%;
+}
+
+/**
+ * Prevent `sub` and `sup` affecting `line-height` in all browsers.
+ */
+
+sub,
+sup {
+ font-size: 75%;
+ line-height: 0;
+ position: relative;
+ vertical-align: baseline;
+}
+
+sup {
+ top: -0.5em;
+}
+
+sub {
+ bottom: -0.25em;
+}
+
+/* Embedded content
+ ========================================================================== */
+
+/**
+ * Remove border when inside `a` element in IE 8/9/10.
+ */
+
+img {
+ border: 0;
+}
+
+/**
+ * Correct overflow not hidden in IE 9/10/11.
+ */
+
+svg:not(:root) {
+ overflow: hidden;
+}
+
+/* Grouping content
+ ========================================================================== */
+
+/**
+ * Address margin not present in IE 8/9 and Safari.
+ */
+
+figure {
+ margin: 1em 40px;
+}
+
+/**
+ * Address differences between Firefox and other browsers.
+ */
+
+hr {
+ -moz-box-sizing: content-box;
+ box-sizing: content-box;
+ height: 0;
+}
+
+/**
+ * Contain overflow in all browsers.
+ */
+
+pre {
+ overflow: auto;
+}
+
+/**
+ * Address odd `em`-unit font size rendering in all browsers.
+ */
+
+code,
+kbd,
+pre,
+samp {
+ font-family: monospace, monospace;
+ font-size: 1em;
+}
+
+/* Forms
+ ========================================================================== */
+
+/**
+ * Known limitation: by default, Chrome and Safari on OS X allow very limited
+ * styling of `select`, unless a `border` property is set.
+ */
+
+/**
+ * 1. Correct color not being inherited.
+ * Known issue: affects color of disabled elements.
+ * 2. Correct font properties not being inherited.
+ * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
+ */
+
+button,
+input,
+optgroup,
+select,
+textarea {
+ color: inherit; /* 1 */
+ font: inherit; /* 2 */
+ margin: 0; /* 3 */
+}
+
+/**
+ * Address `overflow` set to `hidden` in IE 8/9/10/11.
+ */
+
+button {
+ overflow: visible;
+}
+
+/**
+ * Address inconsistent `text-transform` inheritance for `button` and `select`.
+ * All other form control elements do not inherit `text-transform` values.
+ * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
+ * Correct `select` style inheritance in Firefox.
+ */
+
+button,
+select {
+ text-transform: none;
+}
+
+/**
+ * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
+ * and `video` controls.
+ * 2. Correct inability to style clickable `input` types in iOS.
+ * 3. Improve usability and consistency of cursor style between image-type
+ * `input` and others.
+ */
+
+button,
+html input[type="button"], /* 1 */
+input[type="reset"],
+input[type="submit"] {
+ -webkit-appearance: button; /* 2 */
+ cursor: pointer; /* 3 */
+}
+
+/**
+ * Re-set default cursor for disabled elements.
+ */
+
+button[disabled],
+html input[disabled] {
+ cursor: default;
+}
+
+/**
+ * Remove inner padding and border in Firefox 4+.
+ */
+
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+ border: 0;
+ padding: 0;
+}
+
+/**
+ * Address Firefox 4+ setting `line-height` on `input` using `!important` in
+ * the UA stylesheet.
+ */
+
+input {
+ line-height: normal;
+}
+
+/**
+ * It's recommended that you don't attempt to style these elements.
+ * Firefox's implementation doesn't respect box-sizing, padding, or width.
+ *
+ * 1. Address box sizing set to `content-box` in IE 8/9/10.
+ * 2. Remove excess padding in IE 8/9/10.
+ */
+
+input[type="checkbox"],
+input[type="radio"] {
+ box-sizing: border-box; /* 1 */
+ padding: 0; /* 2 */
+}
+
+/**
+ * Fix the cursor style for Chrome's increment/decrement buttons. For certain
+ * `font-size` values of the `input`, it causes the cursor style of the
+ * decrement button to change from `default` to `text`.
+ */
+
+input[type="number"]::-webkit-inner-spin-button,
+input[type="number"]::-webkit-outer-spin-button {
+ height: auto;
+}
+
+/**
+ * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
+ * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
+ * (include `-moz` to future-proof).
+ */
+
+input[type="search"] {
+ -webkit-appearance: textfield; /* 1 */
+ -moz-box-sizing: content-box;
+ -webkit-box-sizing: content-box; /* 2 */
+ box-sizing: content-box;
+}
+
+/**
+ * Remove inner padding and search cancel button in Safari and Chrome on OS X.
+ * Safari (but not Chrome) clips the cancel button when the search input has
+ * padding (and `textfield` appearance).
+ */
+
+input[type="search"]::-webkit-search-cancel-button,
+input[type="search"]::-webkit-search-decoration {
+ -webkit-appearance: none;
+}
+
+/**
+ * Define consistent border, margin, and padding.
+ */
+
+fieldset {
+ border: 1px solid #c0c0c0;
+ margin: 0 2px;
+ padding: 0.35em 0.625em 0.75em;
+}
+
+/**
+ * 1. Correct `color` not being inherited in IE 8/9/10/11.
+ * 2. Remove padding so people aren't caught out if they zero out fieldsets.
+ */
+
+legend {
+ border: 0; /* 1 */
+ padding: 0; /* 2 */
+}
+
+/**
+ * Remove default vertical scrollbar in IE 8/9/10/11.
+ */
+
+textarea {
+ overflow: auto;
+}
+
+/**
+ * Don't inherit the `font-weight` (applied by a rule above).
+ * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
+ */
+
+optgroup {
+ font-weight: bold;
+}
+
+/* Tables
+ ========================================================================== */
+
+/**
+ * Remove most spacing between table cells.
+ */
+
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
+
+td,
+th {
+ padding: 0;
+}
diff --git a/_site/docs/class.md b/_site/docs/class.md
new file mode 100644
index 0000000..2e268bb
--- /dev/null
+++ b/_site/docs/class.md
@@ -0,0 +1,131 @@
+# Class和Module
+
+## Class
+
+ES6引入了Class（类）这个概念，可以定义class，作为对象的模板。
+
+```javascript
+
+class Point {
+
+ constructor(x, y) {
+ this.x = x;
+ this.y = y;
+ }
+
+ toString() {
+ return '('+this.x+', '+this.y+')';
+ }
+
+}
+
+```
+
+上面代码定义了一个class类，可以看到里面有一个constructor函数，这就是构造函数。而this关键字则代表实例对象。
+
+class之间可以通过extends关键字，实现继承。
+
+```javascript
+
+class ColorPoint extends Point {
+
+ constructor(x, y, color) {
+ super(x, y); // same as super.constructor(x, y)
+ this.color = color;
+ }
+
+ toString() {
+ return this.color+' '+super();
+ }
+
+}
+
+```
+
+上面代码定义了一个ColorPoint类，该类通过extends关键字，继承了Point类的所有属性和方法。在constructor方法内，super就指代父类Point。
+
+## Module的基本用法
+
+ES6允许将独立的js文件作为模块，也就是说，允许一个JavaScript脚本文件调用另一个脚本文件，从而使得模块化编程成为可能。
+
+假设有一个circle.js，它是一个单独模块。
+
+```javascript
+
+// circle.js
+
+export function area(radius) {
+ return Math.PI * radius * radius;
+}
+
+export function circumference(radius) {
+ return 2 * Math.PI * radius;
+}
+
+```
+
+上面代码中的export关键字，表示这个方法是对外开放的接口。
+
+然后，main.js引用这个模块。
+
+```javascript
+
+// main.js
+
+import { area, circumference } from 'circle';
+
+console.log("圆面积：" + area(4));
+console.log("圆周长：" + circumference(14));
+
+```
+
+import语句用来导入模块，它接受一个对象，里面指定所要导入的方法，后面的from指定模块名。
+
+另一种写法是使用module命令，整体加载circle.js。
+
+```javascript
+
+// main.js
+
+module circle from 'circle';
+
+console.log("圆面积：" + circle.area(4));
+console.log("圆周长：" + circle.circumference(14));
+
+```
+
+module命令跟一个变量，表示加载的模块定义在该变量上。
+
+## 模块的继承
+
+模块之间也可以继承。
+
+假设有一个circleplus模块，继承了circle模块。
+
+```javascript
+
+// circleplus.js
+
+export * from 'circle';
+export var e = 2.71828182846;
+export default function(x) {
+ return Math.exp(x);
+}
+
+```
+
+上面代码中的“export *”，表示导入circle模块的所有属性和方法。export default命令表示，定义模块的默认方法。
+
+加载上面模块的写法如下。
+
+```javascript
+
+// main.js
+
+module math from "circleplus";
+import exp from "circleplus";
+console.log(exp(math.pi));
+
+```
+
+上面代码中的"import exp"表示，将circleplus模块的默认方法加载为exp方法。
diff --git a/_site/docs/comprehension.md b/_site/docs/comprehension.md
new file mode 100644
index 0000000..57dffde
--- /dev/null
+++ b/_site/docs/comprehension.md
@@ -0,0 +1,68 @@
+# 数组推导
+
+ES6提供简洁写法，允许直接通过现有数组生成新数组，这被称为数组推导（array comprehension）。
+
+```javascript
+
+var a1 = [1, 2, 3, 4];
+var a2 = [i * 2 for (i of a1)];
+
+a2 // [2, 4, 6, 8]
+
+```
+
+上面代码表示，通过for...of结构，数组a2直接在a1的基础上生成。
+
+数组推导可以替代map和filter方法。
+
+```javascript
+
+[for (i of [1, 2, 3]) i * i];
+// 等价于
+[1, 2, 3].map(function (i) { return i * i });
+
+[i for (i of [1,4,2,3,-8]) if (i < 3)];
+// 等价于
+[1,4,2,3,-8].filter(function(i) { return i < 3 });
+
+```
+
+上面代码说明，模拟map功能只要单纯的for...of循环就行了，模拟filter功能除了for...of循环，还必须加上if语句。
+
+新引入的for...of结构，可以直接跟在表达式的前面或后面，甚至可以在一个数组推导中，使用多个for...of结构。
+
+```javascript
+
+var a1 = ["x1", "y1"];
+var a2 = ["x2", "y2"];
+var a3 = ["x3", "y3"];
+
+[(console.log(s + w + r)) for (s of a1) for (w of a2) for (r of a3)];
+// x1x2x3
+// x1x2y3
+// x1y2x3
+// x1y2y3
+// y1x2x3
+// y1x2y3
+// y1y2x3
+// y1y2y3
+
+```
+
+上面代码在一个数组推导之中，使用了三个for...of结构。
+
+需要注意的是，数组推导的方括号构成了一个单独的作用域，在这个方括号中声明的变量类似于使用let语句声明的变量。
+
+由于字符串可以视为数组，因此字符串也可以直接用于数组推导。
+
+```javascript
+
+[c for (c of 'abcde') if (/[aeiou]/.test(c))].join('') // 'ae'
+
+[c+'0' for (c of 'abcde')].join('') // 'a0b0c0d0e0'
+
+```
+
+上面代码使用了数组推导，对字符串进行处理。
+
+数组推导需要注意的地方是，新数组会立即在内存中生成。这时，如果原数组是一个很大的数组，将会非常耗费内存。
diff --git a/_site/docs/destructuring.md b/_site/docs/destructuring.md
new file mode 100644
index 0000000..8bb52fa
--- /dev/null
+++ b/_site/docs/destructuring.md
@@ -0,0 +1,121 @@
+# 多变量的模式赋值
+
+ES6允许按照一定模式，一次性对多个变量进行赋值，这又称为解构（Destructuring）。
+
+正常情况下，将数组元素赋值给多个变量，只能一次次分开赋值。
+
+```javascript
+
+var a = 1;
+var b = 2;
+var c = 3;
+
+```
+
+ES6允许写成下面这样。
+
+```javascript
+
+var [a, b, c] = [1, 2, 3];
+
+```
+
+本质上，这种写法属于模式匹配，只要等号两边的模式相同，左边的变量就会被赋予对应的值。下面是一些嵌套数组进行模式赋值的例子。
+
+```javascript
+
+var [foo, [[bar], baz]] = [1, [[2], 3]]
+
+var [,,third] = ["foo", "bar", "baz"]
+
+var [head, ...tail] = [1, 2, 3, 4]
+
+```
+
+模式赋值还允许指定默认值。
+
+```javascript
+
+var [missing = true] = [];
+
+console.log(missing)
+// true
+
+var { x = 3 } = {};
+console.log(x)
+// 3
+
+```
+
+模式赋值不仅可以用于数组，还可以用于对象。
+
+```javascript
+
+var { foo, bar } = { foo: "lorem", bar: "ipsum" };
+
+foo // "lorem"
+bar // "ipsum"
+
+var o = {
+ p1: [
+ "Hello",
+ { p2: "World" }
+ ]
+};
+
+var { a: [x, { y }] } = o;
+
+x // "Hello"
+y // "World"
+
+```
+
+这种写法的用途很多。
+
+（1）交换变量的值
+
+```javascript
+
+[x, y] = [y, x];
+
+```
+
+（2）从函数返回多个值
+
+```javascript
+
+function example() {
+ return [1, 2, 3];
+}
+
+var [a, b, c] = example();
+
+```
+
+（3）函数参数的定义
+
+```javascript
+
+function f({p1, p2, p3}) {
+ // ...
+}
+
+```
+
+（4）函数参数的默认值
+
+```javascript
+
+jQuery.ajax = function (url, {
+ async = true,
+ beforeSend = function () {},
+ cache = true,
+ complete = function () {},
+ crossDomain = false,
+ global = true,
+ // ... more config
+}) {
+ // ... do stuff
+};
+
+```
diff --git a/_site/docs/function.md b/_site/docs/function.md
new file mode 100644
index 0000000..5c15225
--- /dev/null
+++ b/_site/docs/function.md
@@ -0,0 +1,228 @@
+# 函数的扩展
+
+## 函数参数的默认值
+
+ES6允许为函数的参数设置默认值。
+
+```javascript
+
+function Point(x = 0, y = 0) {
+ this.x = x;
+ this.y = y;
+}
+
+var p = new Point();
+// p = { x:0, y:0 }
+
+```
+
+任何带有默认值的参数，被视为可选参数。不带默认值的参数，则被视为必需参数。
+
+利用参数默认值，可以指定一个参数不得省略，如果省略就抛出一个错误。
+
+```javascript
+
+function throwIfMissing() {
+ throw new Error('Missing parameter');
+ }
+
+function foo(mustBeProvided = throwIfMissing()) {
+ return mustBeProvided;
+}
+
+foo()
+// Error: Missing parameter
+
+```
+
+上面代码的foo函数，如果调用的时候没有参数，就会调用默认值throwIfMissing函数，从而抛出一个错误。
+
+## rest（...）运算符
+
+ES6引入rest运算符（...），用于获取函数的多余参数，这样就不需要使用arguments.length了。rest运算符后面是一个数组变量，该变量将多余的参数放入数组中。
+
+```javascript
+
+function add(...values) {
+ let sum = 0;
+
+ for (var val of values) {
+ sum += val;
+ }
+
+ return sum;
+}
+
+add(2, 5, 3) // 10
+
+```
+
+上面代码的add函数是一个求和函数，利用rest运算符，可以向该函数传入任意数目的参数。
+
+下面是一个利用rest运算符改写数组push方法的例子。
+
+```javascript
+
+function push(array, ...items) {
+ items.forEach(function(item) {
+ array.push(item);
+ console.log(item);
+ });
+}
+
+var a = [];
+push(a, "a1", "a2", "a3", "a4");
+
+```
+
+注意，rest参数不能再有其他参数，否则会报错。
+
+```javascript
+
+// 报错
+function f(a, ...b, c) {
+ // ...
+}
+
+```
+
+rest运算符不仅可以用于函数定义，还可以用于函数调用。
+
+```javascript
+
+function f(s1, s2, s3, s4, s5) {
+ console.log(s1 + s2 + s3 + s4 +s5);
+}
+
+var a = ["a2", "a3", "a4", "a5"];
+
+f("a1", ...a)
+// a1a2a3a4a5
+
+```
+
+从上面的例子可以看出，rest运算符的另一个重要作用是，可以将数组转变成正常的参数序列。利用这一点，可以简化求出一个数组最大元素的写法。
+
+```javascript
+
+// ES5
+Math.max.apply(null, [14, 3, 77])
+
+// ES6
+Math.max(...[14, 3, 77])
+
+// 等同于
+Math.max(14, 3, 77);
+
+```
+
+上面代码表示，由于JavaScript不提供求数组最大元素的函数，所以只能套用Math.max函数，将数组转为一个参数序列，然后求最大值。有了rest运算符以后，就可以直接用Math.max了。
+
+## 箭头函数
+
+ES6允许使用“箭头”（=>）定义函数。
+
+```javascript
+
+var f = v => v;
+
+```
+
+上面的箭头函数等同于：
+
+```javascript
+
+var f = function(v) {
+ return v;
+};
+
+```
+
+如果箭头函数不需要参数或需要多个参数，就使用一个圆括号代表参数部分。
+
+```javascript
+
+var f = () => 5;
+// 等同于
+var f = function (){ return 5 };
+
+var sum = (num1, num2) => num1 + num2;
+// 等同于
+var sum = function(num1, num2) {
+ return num1 + num2;
+};
+
+```
+
+如果箭头函数的代码块部分多于一条语句，就要使用大括号将它们括起来，并且使用return语句返回。
+
+```javascript
+
+var sum = (num1, num2) => { return num1 + num2; }
+
+```
+
+由于大括号被解释为代码块，所以如果箭头函数直接返回一个对象，必须在对象外面加上括号。
+
+```javascript
+
+var getTempItem = id => ({ id: id, name: "Temp" });
+
+```
+箭头函数的一个用处是简化回调函数。
+
+```javascript
+
+// 正常函数写法
+[1,2,3].map(function (x) {
+ return x * x;
+});
+
+// 箭头函数写法
+[1,2,3].map(x => x * x);
+
+```
+
+另一个例子是
+
+```javascript
+
+// 正常函数写法
+var result = values.sort(function(a, b) {
+ return a - b;
+});
+
+// 箭头函数写法
+var result = values.sort((a, b) => a - b);
+
+```
+
+箭头函数有几个使用注意点。
+
+- 函数体内的this对象，绑定定义时所在的对象，而不是使用时所在的对象。
+- 不可以当作构造函数，也就是说，不可以使用new命令，否则会抛出一个错误。
+- 不可以使用arguments对象，该对象在函数体内不存在。
+
+关于this对象，下面的代码将它绑定定义时的对象。
+
+```javascript
+
+var handler = {
+
+ id: "123456",
+
+ init: function() {
+ document.addEventListener("click",
+ event => this.doSomething(event.type), false);
+ },
+
+ doSomething: function(type) {
+ console.log("Handling " + type + " for " + this.id);
+ }
+};
+
+```
+
+上面代码的init方法中，使用了箭头函数，这导致this绑定handler对象。否则，doSomething方法内部的this对象就指向全局对象，运行时会报错。
+
+由于this在箭头函数中被绑定，所以不能用call()、apply()、bind()这些方法去改变this的指向。
diff --git a/_site/docs/generator.md b/_site/docs/generator.md
new file mode 100644
index 0000000..c44ab71
--- /dev/null
+++ b/_site/docs/generator.md
@@ -0,0 +1,180 @@
+# Generator 函数
+
+## 含义
+
+所谓Generator，简单说，就是一个内部状态的遍历器，即每调用一次遍历器，内部状态发生一次改变（可以理解成发生某些事件）。ES6引入了generator函数，作用就是可以完全控制内部状态的变化，依次遍历这些状态。
+
+generator函数就是普通函数，但是有两个特征。一是，function关键字后面有一个星号；二是，函数体内部使用yield语句，定义遍历器的每个成员（即不同的内部状态）。
+
+```javascript
+
+function* helloWorldGenerator() {
+ yield 'hello';
+ yield 'world';
+}
+
+var hw = helloWorldGenerator();
+
+```
+
+上面代码定义了一个generator函数helloWorldGenerator，它的遍历器有两个成员“hello”和“world”。调用这个函数，就会得到遍历器。
+
+当调用generator函数的时候，该函数并不执行，而是返回一个遍历器（可以理解成暂停执行）。以后，每次调用这个遍历器的next方法，就从函数体的头部或者上一次停下来的地方开始执行（可以理解成恢复执行），直到遇到下一个yield语句为止。也就是说，next方法就是在遍历yield语句定义的内部状态。
+
+```javascript
+
+hw.next()
+// { value: 'hello', done: false }
+
+hw.next()
+// { value: 'world', done: false }
+
+hw.next()
+// { value: undefined, done: true }
+
+hw.next()
+// Error: Generator has already finished
+// ...
+
+```
+
+上面代码一共调用了四次next方法。
+
+- 第一次调用
+
+函数开始执行，直到遇到第一句yield语句为止。next方法返回一个对象，它的value属性就是当前yield语句的值hello，done属性的值false，表示遍历还没有结束。
+
+- 第二次调用
+
+函数从上次yield语句停下的地方，一直执行到下一个yield语句。next方法返回的对象的value属性就是当前yield语句的值world，done属性的值false，表示遍历还没有结束。
+
+- 第三次调用
+
+函数从上次yield语句停下的地方，一直执行到函数结束。next方法返回的对象的value属性就是函数最后的返回值，由于上例的函数没有return语句（即没有返回值），所以value属性的值为undefined，done属性的值true，表示遍历已经结束。
+
+- 第四次调用
+
+由于此时函数已经运行完毕，next方法直接抛出一个错误。
+
+Generator函数使用iterator接口，每次调用next方法的返回值，就是一个标准的iterator返回值：有着value和done两个属性的对象。其中，value是yield语句后面那个表达式的值，done是一个布尔值，表示是否遍历结束。
+
+Generator函数的本质，其实是提供一种可以暂停执行的函数。yield语句就是暂停标志，next方法遇到yield，就会暂停执行后面的操作，并将紧跟在yield后面的那个表达式的值，作为返回对象的value属性的值。当下一次调用next方法时，再继续往下执行，直到遇到下一个yield语句。如果没有再遇到新的yield语句，就一直运行到函数结束，将return语句后面的表达式的值，作为value属性的值，如果该函数没有return语句，则value属性的值为undefined。
+
+yield语句与return语句有点像，都能返回紧跟在语句后面的那个表达式的值。区别在于每次遇到yield，函数暂停执行，下一次再从该位置继续向后执行，而return语句不具备位置记忆的功能。
+
+## next方法的参数
+
+yield语句本身没有返回值，或者说总是返回undefined。next方法可以带一个参数，该参数就会被当作上一个yield语句的返回值。
+
+```javascript
+
+function* f() {
+ for(var i=0; true; i++) {
+ var reset = yield i;
+ if(reset) { i = -1; }
+ }
+}
+
+var g = f();
+
+g.next() // { value: 0, done: false }
+g.next() // { value: 1, done: false }
+g.next(true) // { value: 0, done: false }
+
+```
+
+上面代码先定义了一个可以无限运行的generator函数f，如果next方法没有参数，每次运行到yield语句，变量reset的值总是undefined。当next方法带一个参数true时，当前的变量reset就被重置为这个参数（即true），因此i会等于-1，下一轮循环就会从-1开始递增。
+
+## 异步操作的应用
+
+generator函数的这种暂停执行的效果，意味着可以把异步操作写在yield语句里面，等到调用next方法时再往后执行。这实际上等同于不需要写回调函数了，因为异步操作的后续操作可以放在yield语句下面，反正要等到调用next方法时再执行。所以，generator函数的一个重要实际意义就是用来处理异步操作，改写回调函数。
+
+```javascript
+
+function* loadUI() {
+ showLoadingScreen();
+ yield loadUIDataAsynchronously();
+ hideLoadingScreen();
+}
+
+// 加载UI
+loadUI.next()
+
+// 卸载UI
+loadUI.next()
+
+```
+
+上面代码表示，第一次调用loadUI函数时，该函数不会执行，仅返回一个遍历器。下一次对该遍历器调用next方法，则会显示登录窗口，并且异步加载数据。再一次使用next方法，则会隐藏登录窗口。可以看到，这种写法的好处是所有登录窗口的逻辑，都被封装在一个函数，按部就班非常清晰。
+
+注意，yield语句是同步运行，不是异步运行（否则就失去了取代回调函数的设计目的了）。实际操作中，一般让yield语句返回Promises对象。
+
+```javascript
+
+var Q = require('q');
+
+function delay(milliseconds) {
+ var deferred = Q.defer();
+ setTimeout(deferred.resolve, milliseconds);
+ return deferred.promise;
+}
+
+function *f(){
+ yield delay(100);
+};
+
+```
+
+上面代码使用Promise的函数库Q，yield语句返回的就是一个Promise对象。
+
+## for...of循环
+
+for...of循环可以自动遍历Generator函数，且此时不再需要调用next方法。
+
+下面是一个利用generator函数和for...of循环，实现斐波那契数列的例子。
+
+```javascript
+
+function* fibonacci() {
+ let [prev, curr] = [0, 1];
+ for (;;) {
+ [prev, curr] = [curr, prev + curr];
+ yield curr;
+ }
+}
+
+for (n of fibonacci()) {
+ if (n > 1000) break;
+ console.log(n);
+}
+
+```
+
+从上面代码可见，使用for...of语句时不需要使用next方法。
+
+## yield*语句
+
+如果yield命令后面跟的是一个遍历器，需要在yield命令后面加上星号，表明它返回的是一个遍历器。这被称为yield*语句。
+
+```javascript
+
+let delegatedIterator = (function* () {
+ yield 'Hello!';
+ yield 'Bye!';
+}());
+
+let delegatingIterator = (function* () {
+ yield 'Greetings!';
+ yield* delegatedIterator;
+ yield 'Ok, bye.';
+}());
+
+for(let value of delegatingIterator) {
+ console.log(value);
+}
+// "Greetings!
+// "Hello!"
+// "Bye!"
+// "Ok, bye."
+
+```
diff --git a/_site/docs/intro.md b/_site/docs/intro.md
new file mode 100644
index 0000000..eb67227
--- /dev/null
+++ b/_site/docs/intro.md
@@ -0,0 +1,86 @@
+# ECMAScript 6简介
+
+ECMAScript 6（以下简称ES6）是JavaScript语言的下一代标准，正处在快速开发之中，大部分已经完成了，预计将在2014年底正式发布。Mozilla将在这个标准的基础上，推出JavaScript 2.0。
+
+ES6的目标，是使得JavaScript语言可以用来编写大型的复杂的应用程序，成为企业级开发语言。
+
+## ECMAScript和JavaScript的关系
+
+ECMAScript是JavaScript语言的国际标准，JavaScript是ECMAScript的实现。
+
+1996年11月，JavaScript的创造者Netscape公司，决定将JavaScript提交给国际标准化组织ECMA，希望这种语言能够成为国际标准。次年，ECMA发布262号标准文件（ECMA-262）的第一版，规定了浏览器脚本语言的标准，并将这种语言称为ECMAScript。这个版本就是ECMAScript 1.0版。
+
+之所以不叫JavaScript，有两个原因。一是商标，Java是Sun公司的商标，根据授权协议，只有Netscape公司可以合法地使用JavaScript这个名字，且JavaScript本身也已经被Netscape公司注册为商标。二是想体现这门语言的制定者是ECMA，不是Netscape，这样有利于保证这门语言的开放性和中立性。因此，ECMAScript和JavaScript的关系是，前者是后者的规格，后者是前者的一种实现。在日常场合，这两个词是可以互换的。
+
+## ECMAScript的历史
+
+1998年6月，ECMAScript 2.0版发布。
+
+1999年12月，ECMAScript 3.0版发布，成为JavaScript的通行标准，得到了广泛支持。
+
+2008年7月，由于对于下一个版本应该包括哪些功能，各方差异太大，争论过于激进，ECMA开会决定，中止ECMAScript 4.0的开发，将其中涉及现有功能改善的一小部分，发布为ECMAScript 3.1，而将其他激进的设想扩大范围，放入以后的版本，由于会议的气氛，该版本的项目代号起名为Harmony（和谐）。会后不久，ECMAScript 3.1就改名为ECMAScript 5。
+
+2009年9月，ECMAScript 5.0版正式发布。Harmony项目则一分为二，一些较为可行的设想定名为Javascript.next继续开发，后来演变成ECMAScript 6；一些不是很成熟的设想，则被视为JavaScript.next.next，在更远的将来再考虑推出。
+
+2011年6月，ECMAscript 5.1版发布，并且成为ISO国际标准（ISO/IEC 16262:2011）。
+
+2013年3月，ECMAScript 6草案冻结，不再添加新功能。新的功能设想将被放到ECMAScript 7。
+
+2013年12月，ECMAScript 6草案发布。然后是12个月的讨论期，听取各方反馈。
+
+2014年12月，ECMAScript 6预计将发布正式版本。
+
+ECMA的第39号技术专家委员会（Technical Committee 39，简称TC39）负责制订ECMAScript标准，成员包括Microsoft、Mozilla、Google等。TC39的总体考虑是，ECMAScript 5与ECMAScript 3基本保持兼容，较大的语法修正和新功能加入，将由JavaScript.next完成。当前，JavaScript.next指的是ECMAScript 6，当第六版发布以后，将指ECMAScript 7。TC39预计，ECMAScript 5会在2013年的年中成为JavaScript开发的主流标准，并在今后五年中一直保持这个位置。
+
+## 部署进度
+
+由于ES6还没有定案，有些语法规则还会变动，目前支持ES6的软件和开发环境还不多。各大浏览器的最新版本，对ES6的支持可以查看[kangax.github.io/es5-compat-table/es6/](http://kangax.github.io/es5-compat-table/es6/)。
+
+## 使用方法
+
+Google公司的V8引擎已经部署了ES6的部分特性。使用node.js 0.11版，就可以体验这些特性。
+
+node.js的0.11版还不是稳定版本，要使用版本管理工具[nvm](https://github.com/creationix/nvm)切换。下载nvm以后，进入项目目录，运行下面的命令。
+
+```bash
+
+source nvm.sh
+nvm use 0.11
+node --harmony
+
+```
+
+启动命令中的--harmony选项可以打开大部分的ES6功能，但是还是--use_strict选项打开块级作用域功能、--harmony_generators选项打开generator功能。使用下面的命令，可以查看所有与ES6有关的选项。
+
+```bash
+
+node --v8-options | grep harmony
+
+```
+
+另外，可以使用Google的[Traceur](https://github.com/google/traceur-compiler)，将ES6代码编译为ES5。
+
+```bash
+# 安装
+npm install -g traceur
+
+# 运行ES6文件
+traceur /path/to/es6
+
+# 将ES6文件转为ES5文件
+traceur --script /path/to/es6 --out /path/to/es5
+```
+
+## ECMAScript 7
+
+2013年3月，ES6的草案封闭，不再接受新功能了。新的功能将被加入ES7。
+
+ES7可能包括的功能有：
+
+（1）**Object.observe**：对象与网页元素的双向绑定，只要其中之一发生变化，就会自动反映在另一者上。
+
+（2）**Multi-Threading**：多线程支持。目前，Intel和Mozilla有一个共同的研究项目RiverTrail，致力于让JavaScript多线程运行。预计这个项目的研究成果会被纳入ECMAScript标准。
+
+（3）**Traits**：它将是“类”功能（class）的一个替代。通过它，不同的对象可以分享同样的特性。
+
+其他可能包括的功能还有：更精确的数值计算、改善的内存回收、增强的跨站点安全、类型化的更贴近硬件的低级别操作、国际化支持（Internationalization Support）、更多的数据结构等等。
diff --git a/_site/docs/iterator.md b/_site/docs/iterator.md
new file mode 100644
index 0000000..7eefae6
--- /dev/null
+++ b/_site/docs/iterator.md
@@ -0,0 +1,187 @@
+# Iterator和for...of循环
+
+## Iterator（遍历器）
+
+遍历器（Iterator）是一种协议，任何对象只要部署这个协议，就可以完成遍历操作。在ES6中，遍历操作特指for...of循环。
+
+ES6的遍历器协议规定，部署了next方法的对象，就具备了遍历器功能。next方法必须返回一个包含value和done两个属性的对象。其中，value属性是当前遍历位置的值，done属性是一个布尔值，表示遍历是否结束。
+
+```javascript
+
+function makeIterator(array){
+ var nextIndex = 0;
+
+ return {
+ next: function(){
+ return nextIndex < array.length ?
+ {value: array[nextIndex++], done: false} :
+ {value: undefined, done: true};
+ }
+ }
+}
+
+var it = makeIterator(['a', 'b']);
+
+it.next().value // 'a'
+it.next().value // 'b'
+it.next().done // true
+
+```
+上面代码定义了一个makeIterator函数，它的作用是返回一个遍历器对象，用来遍历参数数组。请特别注意，next返回值的构造。
+
+下面是一个无限运行的遍历器例子。
+
+```javascript
+
+function idMaker(){
+ var index = 0;
+
+ return {
+ next: function(){
+ return {value: index++, done: false};
+ }
+ }
+}
+
+var it = idMaker();
+
+it.next().value // '0'
+it.next().value // '1'
+it.next().value // '2'
+// ...
+
+```
+
+一个对象只要具备了next方法，就可以用for...of循环遍历它的值。
+
+```javascript
+
+for (var n of it) {
+ if (n > 5)
+ break;
+ console.log(n);
+}
+
+```
+
+## for...of循环
+
+ES6中，任何具备了iterator接口的对象，都可以用for...of循环遍历。数组原生具备iterator接口。
+
+```javascript
+
+const arr = ['red', 'green', 'blue'];
+
+for(let v of arr) {
+ console.log(v);
+}
+\\ red
+\\ green
+\\ blue
+
+```
+
+JavaScript原有的for...in循环，只能获得对象的键名，不能直接获取键值。ES6提供for...of循环，允许遍历获得键值。
+
+```javascript
+
+var arr = ["a", "b", "c", "d"];
+for (a in arr) {
+ console.log(a);
+}
+// 0
+// 1
+// 2
+// 3
+
+for (a of arr) {
+ console.log(a);
+}
+// a
+// b
+// c
+// d
+
+```
+
+上面代码表明，for...in循环读取键名，for...of循环读取键值。
+
+对于Set和Map结构的数据，可以直接使用for...of循环。
+
+```javascript
+
+var engines = Set(["Gecko", "Trident", "Webkit", "Webkit"]);
+for (var e of engines) {
+ console.log(e);
+}
+// Gecko
+// Trident
+// Webkit
+
+var es6 = new Map();
+es6.set("edition", 6);
+es6.set("committee", "TC39");
+es6.set("standard", "ECMA-262");
+for (var [name, value] of es6) {
+ console.log(name + ": " + value);
+}
+// edition: 6
+// committee: TC39
+// standard: ECMA-262
+
+```
+
+上面代码演示了如何遍历Set结构和Map结构，后者是同时遍历键名和键值。
+
+对于普通的对象，for...of结构不能直接使用，会报错，必须部署了iterator接口后才能使用。但是，这样情况下，for...in循环依然可以用来遍历键名。
+
+```javascript
+
+var es6 = {
+ edition: 6,
+ committee: "TC39",
+ standard: "ECMA-262"
+};
+
+for (e in es6) {
+ console.log(e);
+}
+// edition
+// committee
+// standard
+
+for (e of es6) {
+ console.log(e);
+}
+// TypeError: es6 is not iterable
+
+```
+
+上面代码表示，for...in循环可以遍历键名，for...of循环会报错。
+
+总结一下，for...of循环可以使用的范围包括数组、类似数组的对象（比如arguments对象、DOM NodeList对象）、Set和Map结构、后文的Generator对象，以及字符串。下面是for...of循环用于字符串和DOM NodeList对象的例子。
+
+```javascript
+
+// 字符串的例子
+
+let str = "hello";
+
+for (let s of str) {
+ console.log(s);
+}
+// h
+// e
+// l
+// l
+// o
+
+// DOM NodeList对象的例子
+
+let paras = document.querySelectorAll("p");
+
+for (let p of paras) {
+ p.classList.add("test");
+}
+
+```
diff --git a/_site/docs/let.md b/_site/docs/let.md
new file mode 100644
index 0000000..bbb2236
--- /dev/null
+++ b/_site/docs/let.md
@@ -0,0 +1,165 @@
+# let和const命令
+
+## let命令
+
+ES6新增了let命令，用来声明变量。它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。
+
+```javascript
+
+{
+ let a = 10;
+ var b = 1;
+}
+
+a // ReferenceError: a is not defined.
+b //1
+
+```
+
+上面代码在代码块之中，分别用let和var声明了两个变量。然后在代码块之外调用这两个变量，结果let声明的变量报错，var声明的变量返回了正确的值。这表明，let声明的变量只在它所在的代码块有效。
+
+下面的代码如果使用var，最后输出的是9。
+
+```javascript
+
+var a = [];
+for (var i = 0; i < 10; i++) {
+ var c = i;
+ a[i] = function () {
+ console.log(c);
+ };
+}
+a[6](); // 9
+
+```
+
+如果使用let，声明的变量仅在块级作用域内有效，最后输出的是6。
+
+```javascript
+
+var a = [];
+for (var i = 0; i < 10; i++) {
+ let c = i;
+ a[i] = function () {
+ console.log(c);
+ };
+}
+a[6](); // 6
+
+```
+
+注意，let不允许在相同作用域内，重复声明同一个变量。
+
+```javascript
+
+// 报错
+{
+ let a = 10;
+ var a = 1;
+}
+
+// 报错
+{
+ let a = 10;
+ let a = 1;
+}
+
+```
+
+## 块级作用域
+
+let实际上为JavaScript新增了块级作用域。
+
+```javascript
+
+function f1() {
+ let n = 5;
+ if (true) {
+ let n = 10;
+ }
+ console.log(n); // 5
+}
+
+```
+
+上面的函数有两个代码块，都声明了变量n，运行后输出5。这表示外层代码块不受内层代码块的影响。如果使用var定义变量n，最后输出的值就是10。
+
+块级作用域的出现，实际上使得获得广泛应用的立即执行函数（IIFE）不再必要了。
+
+```javascript
+
+// IIFE写法
+(function () {
+ var tmp = ...;
+ ...
+}());
+
+// 块级作用域写法
+{
+ let tmp = ...;
+ ...
+}
+
+```
+
+另外，ES6的函数也默认在块级作用域内声明。
+
+```javascript
+
+function f() { console.log('I am outside!'); }
+(function () {
+ if(false) {
+ // What should happen with this redeclaration?
+ function f() { console.log('I am inside!'); }
+ }
+
+ f();
+}());
+
+```
+
+上面代码在ES5中运行，会得到“I am inside!”，但是在ES6中运行，会得到“I am outside!”。
+
+## const命令
+
+const也用来声明变量，但是声明的是常量。一旦声明，常量的值就不能改变。
+
+```javascript
+
+const PI = 3.1415;
+PI // 3.1415
+
+PI = 3;
+PI // 3.1415
+
+const PI = 3.1;
+PI // 3.1415
+
+```
+
+上面代码表明改变常量的值是不起作用的。需要注意的是，对常量重新赋值不会报错，只会默默地失败。
+
+const的作用域与let命令相同：只在声明所在的块级作用域内有效。
+
+```javascript
+
+if (condition) {
+ const MAX = 5;
+}
+
+// 常量MAX在此处不可得
+
+```
+
+const声明的常量，也与let一样不可重复声明。
+
+```javascript
+
+var message = "Hello!";
+let age = 25;
+
+// 以下两行都会报错
+const message = "Goodbye!";
+const age = 30;
+
+```
diff --git a/_site/docs/number.md b/_site/docs/number.md
new file mode 100644
index 0000000..2eac533
--- /dev/null
+++ b/_site/docs/number.md
@@ -0,0 +1,88 @@
+# 数值的扩展
+
+## 二进制和八进制表示法
+
+ES6提供了二进制和八进制数值的新的写法，分别用前缀0b和0o表示。
+
+```javascript
+
+0b111110111 === 503 // true
+0o767 === 503 // true
+
+```
+
+八进制用0o前缀表示的方法，将要取代已经在ES5中被逐步淘汰的加前缀0的写法。
+
+## Number.isFinite(), Number.isNaN()
+
+ES6在Number对象上，新提供了Number.isFinite()和Number.isNaN()两个方法，用来检查Infinite和NaN这两个特殊值。
+
+它们与传统的isFinite()和isNaN()的区别在于，传统方法先调用Number()将非数值的值转为数值，再进行判断，而这两个新方法只对数值有效，非数值一律返回false。
+
+```javascript
+
+isFinite(25) // true
+isFinite("25") // true
+Number.isFinite(25) // true
+Number.isFinite("25") // false
+
+isNaN(NaN) // true
+isNaN("NaN") // true
+Number.isNaN(NaN) // true
+Number.isNaN("NaN") // false
+
+```
+
+## Number.parseInt(), Number.parseFloat()
+
+ES6将全局方法parseInt()和parseFloat()，移植到Number对象上面，行为完全保持不变。
+
+这样做的目的，是逐步减少全局性方法，使得语言逐步模块化。
+
+## Number.isInteger()和安全整数
+
+Number.isInteger()用来判断一个值是否为整数。需要注意的是，在JavaScript内部，整数和浮点数是同样的储存方法，所以3和3.0被视为同一个值。
+
+```javascript
+
+Number.isInteger(25) // true
+Number.isInteger(25.0) // true
+Number.isInteger(25.1) // false
+
+```
+
+JavaScript能够准确表示的整数范围在-2ˆ53 and 2ˆ53之间。ES6引入了Number.MAX_SAFE_INTEGER和Number.MIN_SAFE_INTEGER这两个常量，用来表示这个范围的上下限。Number.isSafeInteger()则是用来判断一个整数是否落在这个范围之内。
+
+```javascript
+
+var inside = Number.MAX_SAFE_INTEGER;
+var outside = inside + 1;
+
+Number.isInteger(inside) // true
+Number.isSafeInteger(inside) // true
+
+Number.isInteger(outside) // true
+Number.isSafeInteger(outside) // false
+
+```
+
+## Math对象的扩展
+
+ES6在Math对象上提供了更多的数学方法。
+
+- Math.acosh(x) 返回x的反双曲余弦（inverse hyperbolic cosine）
+- Math.asinh(x) 返回x的反双曲正弦（inverse hyperbolic sine）
+- Math.atanh(x) 返回x的反双曲正切（inverse hyperbolic tangent）
+- Math.cbrt(x) 返回x的立方根
+- Math.clz32(x) 返回x的32位二进制整数表示形式的前导0的个数
+- Math.cosh(x) 返回x的双曲余弦（hyperbolic cosine）
+- Math.expm1(x) 返回eˆx - 1
+- Math.fround(x) 返回x的单精度浮点数形式
+- Math.hypot(...values) 返回所有参数的平方的和的平方根
+- Math.imul(x, y) 返回两个参数以32位整数形式相乘的结果
+- Math.log1p(x) 返回1 + x的自然对数
+- Math.log10(x) 返回以10为底的x的对数
+- Math.log2(x) 返回以2为底的x的对数
+- Math.sign(x) 如果x为负返回-1，x为0返回0，x为正返回1
+- Math.tanh(x) 返回x的双曲正切（hyperbolic tangent）
+- Math.trunc(x) 移除一个浮点数的小数位，返回一个整数
diff --git a/_site/docs/object.md b/_site/docs/object.md
new file mode 100644
index 0000000..12ba8c0
--- /dev/null
+++ b/_site/docs/object.md
@@ -0,0 +1,219 @@
+# 对象和函数的扩展
+
+## Object.is()
+
+Object.is()用来比较两个值是否严格相等。它与严格比较运算符（===）的行为基本一致，不同之处只有两个：一是+0不等于-0，二是NaN等于自身。
+
+```javascript
+
++0 === -0 //true
+NaN === NaN // false
+
+Object.is(+0, -0) // false
+Object.is(NaN, NaN) // true
+
+```
+
+## __proto__属性
+
+ES6正式将__proto__属性写入了标准，用来指定对象的prototype对象。
+
+```javascript
+
+var obj = {
+ __proto__: someOtherObj,
+ method: function() { ... }
+}
+
+```
+
+有了这个属性，实际上已经不需要通过Object.create()来生成新对象了。
+
+## 增强的对象写法
+
+ES6允许直接写入变量和函数，作为对象的属性和方法。这样的书写更加简洁。
+
+```javascript
+
+var Person = {
+
+ name: '张三',
+
+ //等同于birth: birth
+ birth,
+
+ // 等同于hello: function ()...
+ hello() { console.log('我的名字是', this.name); }
+
+};
+
+```
+
+## 属性名表达式
+
+ES6允许表达式作为对象的属性名，在写法上要把表达式放在大括号内。
+
+```javascript
+
+var lastWord = "last word";
+
+var a = {
+ "first word": "hello",
+ [lastWord]: "world"
+};
+
+a["first word"] // "hello"
+a[lastWord] // "world"
+a["last word"] // "world"
+
+```
+
+上面代码中，对象a的属性名lastWord是一个变量。
+
+下面是一个将字符串的加法表达式作为属性名的例子。
+
+```javascript
+
+var suffix = " word";
+
+var a = {
+ ["first" + suffix]: "hello",
+ ["last" + suffix]: "world"
+};
+
+a["first word"] // "hello"
+a["last word"] // "world"
+
+```
+
+## symbols
+
+ES6引入了一种新的原始数据类型symbol。它通过Symbol函数生成。
+
+```javascript
+
+var mySymbol = Symbol('Test');
+
+mySymbol.name
+// Test
+
+typeof mySymbol
+// "symbol"
+
+```
+
+上面代码表示，Symbol函数接受一个字符串作为参数，用来指定生成的symbol的名称，可以通过name属性读取。typeof运算符的结果，表明Symbol是一种单独的数据类型。
+
+注意，Symbol函数前不能使用new命令，否则会报错。这是因为生成的symbol是一个原始类型的值，不是对象。
+
+symbol的最大特点，就是每一个symbol都是不相等的，保证产生一个独一无二的值。
+
+```javascript
+
+let red = Symbol();
+let green = Symbol();
+let blue = Symbol();
+
+function handleColor(color) {
+ switch (color) {
+ case red:
+ ...
+ case green:
+ ...
+ case blue:
+ ...
+ }
+}
+
+```
+
+上面代码中，red、green、blue三个变量都是Symbol类型，它们的值是不相等的。
+
+由于这种特点，Symbol类型适合作为标识符，用于对象的属性名，保证了属性名之间不会发生冲突。如果一个对象由多个模块构成，不会出现同名的属性。
+
+```javascript
+
+var a = {};
+var mySymbol = Symbol();
+
+a[mySymbol] = 'Hello!';
+
+//另一种写法
+Object.defineProperty(a, mySymbol, { value: 'Hello!' });
+
+```
+
+上面代码通过点结构和Object.defineProperty两种方法，为对象增加一个属性。
+
+下面的写法为Map结构添加了一个成员，但是该成员永远无法被引用。
+
+```javascript
+
+let a = Map();
+a.set(Symbol(), 'Noise');
+a.size // 1
+
+```
+
+如果要在对象内部使用symbol属性名，必须采用属性名表达式。
+
+```javascript
+
+let specialMethod = Symbol();
+
+let obj = {
+ [specialMethod]: function (arg) {
+ ...
+ }
+};
+
+obj[specialMethod](123);
+
+```
+
+## Proxy
+
+所谓Proxy，可以理解成在目标对象之前，架设一层“拦截”，外界对该对象的访问，都必须先通过这层拦截，可以被过滤和改写。
+
+ES6原生提供Proxy构造函数，用来生成proxy实例对象。
+
+```javascript
+
+var proxy = new Proxy({}, {
+ get: function(target, property) {
+ return 35;
+ }
+});
+
+proxy.time // 35
+proxy.name // 35
+proxy.title // 35
+
+```
+
+上面代码就是Proxy构造函数使用实例，它接受两个参数，第一个所要代理的目标对象（上例是一个空对象），第二个是拦截函数，它有一个get方法，用来拦截对目标对象的访问请求。get方法的两个参数分别是目标对象和所要访问的属性。可以看到，由于拦截函数总是返回35，所以访问任何属性都得到35。
+
+下面是另一个拦截函数的例子。
+
+```javascript
+
+var person = {
+ name: "张三"
+};
+
+var proxy = new Proxy(target, {
+ get: function(target, property) {
+ if (property in target) {
+ return target[property];
+ } else {
+ throw new ReferenceError("Property \"" + property + "\" does not exist.");
+ }
+ }
+});
+
+proxy.name // "张三"
+proxy.age // 抛出一个错误
+
+```
+
+上面代码表示，如果访问目标对象不存在的属性，会抛出一个错误。如果没有这个拦截函数，访问不存在的属性，只会返回undefined。
diff --git a/_site/docs/promise.md b/_site/docs/promise.md
new file mode 100644
index 0000000..259a3a3
--- /dev/null
+++ b/_site/docs/promise.md
@@ -0,0 +1,165 @@
+# Promise对象
+
+## 基本用法
+
+ES6原生提供了Promise对象。所谓Promise对象，就是代表了未来某个将要发生的事件（通常是一个异步操作）。它的好处在于，有了Promise对象，就可以将异步操作以同步操作的流程表达出来，避免了层层嵌套的回调函数。此外，Promise对象还提供了一整套完整的接口，使得可以更加容易地控制异步操作。Promise对象的概念的详细解释，请参考[《JavaScript标准参考教程》](http://javascript.ruanyifeng.com/)。
+
+ES6的Promise对象是一个构造函数，用来生成Promise实例。下面是Promise对象的基本用法。
+
+```javascript
+
+var promise = new Promise(function(resolve, reject) {
+ if (/* 异步操作成功 */){
+ resolve(value);
+ } else {
+ reject(error);
+ }
+});
+
+promise.then(function(value) {
+ // success
+}, function(value) {
+ // failure
+});
+
+```
+
+上面代码表示，Promise构造函数接受一个函数作为参数，该函数的两个参数分别是resolve方法和reject方法。如果异步操作成功，则用resolve方法将Promise对象的状态变为“成功”（即从pending变为resolved）；如果异步操作失败，则用reject方法将状态变为“失败”（即从pending变为rejected）。
+
+promise实例生成以后，可以用then方法分别指定resolve方法和reject方法的回调函数。
+
+下面是一个用Promise对象实现的Ajax操作的例子。
+
+```javascript
+
+var getJSON = function(url) {
+ var promise = new Promise(function(resolve, reject){
+ var client = new XMLHttpRequest();
+ client.open("GET", url);
+ client.onreadystatechange = handler;
+ client.responseType = "json";
+ client.setRequestHeader("Accept", "application/json");
+ client.send();
+
+ function handler() {
+ if (this.readyState === this.DONE) {
+ if (this.status === 200) { resolve(this.response); }
+ else { reject(this); }
+ }
+ };
+ });
+
+ return promise;
+};
+
+getJSON("/posts.json").then(function(json) {
+ // continue
+}, function(error) {
+ // handle errors
+});
+
+```
+
+## 链式操作
+
+then方法返回的是一个新的Promise对象，因此可以采用链式写法。
+
+```javascript
+
+getJSON("/posts.json").then(function(json) {
+ return json.post;
+}).then(function(post) {
+ // proceed
+});
+
+```
+
+上面的代码使用then方法，依次指定了两个回调函数。第一个回调函数完成以后，会将返回结果作为参数，传入第二个回调函数。
+
+如果前一个回调函数返回的是Promise对象，这时后一个回调函数就会等待该Promise对象有了运行结果，才会进一步调用。
+
+```javascript
+
+getJSON("/post/1.json").then(function(post) {
+ return getJSON(post.commentURL);
+}).then(function(comments) {
+ // 对comments进行处理
+});
+
+```
+
+这种设计使得嵌套的异步操作，可以被很容易得改写，从回调函数的“横向发展”改为“向下发展”。
+
+## catch方法：捕捉错误
+
+catch方法是then(null, rejection)的别名，用于指定发生错误时的回调函数。
+
+```javascript
+
+getJSON("/posts.json").then(function(posts) {
+ // some code
+}).catch(function(error) {
+ // 处理前一个回调函数运行时发生的错误
+});
+
+```
+
+Promise对象的错误具有“冒泡”性质，会一直向后传递，直到被捕获为止。
+
+```javascript
+
+getJSON("/post/1.json").then(function(post) {
+ return getJSON(post.commentURL);
+}).then(function(comments) {
+ // some code
+}).catch(function(error) {
+ // 处理前两个回调函数的错误
+});
+
+```
+
+## Promise.all方法
+
+Promise.all方法用于将多个异步操作（或Promise对象），包装成一个新的Promise对象。当这些异步操作都完成后，新的Promise对象的状态才会变为fulfilled；只要其中一个异步操作失败，新的Promise对象的状态就会变为rejected。
+
+```javascript
+
+// 生成一个promise对象的数组
+var promises = [2, 3, 5, 7, 11, 13].map(function(id){
+ return getJSON("/post/" + id + ".json");
+});
+
+Promise.all(promises).then(function(posts) {
+ // ...
+}).catch(function(reason){
+ // ...
+});
+
+```
+
+## Promise.resolve方法
+
+有时需要将现有对象转为Promise对象，Promise.resolve方法就起到这个作用。
+
+```javascript
+
+var jsPromise = Promise.resolve($.ajax('/whatever.json'));
+
+```
+
+上面代码将jQuery生成deferred对象，转为一个新的ES6的Promise对象。
+
+如果Promise.resolve方法的参数，不是具有then方法的对象（又称thenable对象），则返回一个新的Promise对象，且它的状态为resolved。
+
+```javascript
+
+var p = Promise.resolve('Hello');
+
+p.then(function (s){
+ console.log(s)
+});
+// Hello
+
+```
+
+上面代码生成一个新的Promise对象，它的状态为fulfilled，所以回调函数会立即执行，Promise.resolve方法的参数就是回调函数的参数。
diff --git a/_site/docs/reference.md b/_site/docs/reference.md
new file mode 100644
index 0000000..0c204b8
--- /dev/null
+++ b/_site/docs/reference.md
@@ -0,0 +1,37 @@
+# 参考链接
+
+## 综合介绍
+
+- Sayanee Basu, [Use ECMAScript 6 Today](http://net.tutsplus.com/articles/news/ecmascript-6-today/)
+- Ariya Hidayat, [Toward Modern Web Apps with ECMAScript 6](http://www.sencha.com/blog/toward-modern-web-apps-with-ecmascript-6/)
+- Dale Schouten, [10 Ecmascript-6 tricks you can perform right now](http://html5hub.com/10-ecmascript-6-tricks-you-can-perform-right-now/)
+- Domenic Denicola, [ES6: The Awesome Parts](http://www.slideshare.net/domenicdenicola/es6-the-awesome-parts)
+- Nicholas C. Zakas, [Understanding ECMAScript 6](https://github.com/nzakas/understandinges6)
+- Justin Drake, [ECMAScript 6 in Node.JS](https://github.com/JustinDrake/node-es6-examples)
+- Ryan Dao, [Summary of ECMAScript 6 major features](http://ryandao.net/portal/content/summary-ecmascript-6-major-features)
+- Luke Hoban, [ES6 features](https://github.com/lukehoban/es6features)
+
+## 语法点
+
+- Nick Fitzgerald, [Destructuring Assignment in ECMAScript 6](http://fitzgeraldnick.com/weblog/50/)
+- Nicholas C. Zakas, [Understanding ECMAScript 6 arrow functions](http://www.nczonline.net/blog/2013/09/10/understanding-ecmascript-6-arrow-functions/)
+- Jack Franklin, [Real Life ES6 - Arrow Functions](http://javascriptplayground.com/blog/2014/04/real-life-es6-arrow-fn/)
+- Axel Rauschmayer, [Handling required parameters in ECMAScript 6](http://www.2ality.com/2014/04/required-parameters-es6.html)
+- Nicholas C. Zakas, [Creating defensive objects with ES6 proxies](http://www.nczonline.net/blog/2014/04/22/creating-defensive-objects-with-es6-proxies/)
+
+## Generator
+
+- Mozilla Developer Network, [Iterators and generators](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Iterators_and_Generators)
+- Matt Baker, [Replacing callbacks with ES6 Generators](http://flippinawesome.org/2014/02/10/replacing-callbacks-with-es6-generators/)
+- Steven Sanderson, [Experiments with Koa and JavaScript Generators](http://blog.stevensanderson.com/2013/12/21/experiments-with-koa-and-javascript-generators/)
+- jmar777, [What's the Big Deal with Generators?](http://devsmash.com/blog/whats-the-big-deal-with-generators)
+
+## Promise对象
+
+- Jake Archibald, [JavaScript Promises: There and back again](http://www.html5rocks.com/en/tutorials/es6/promises/)
+- Tilde, [rsvp.js](https://github.com/tildeio/rsvp.js)
+
+## 工具
+
+- Casper Beyer, [ECMAScript 6 Features and Tools](http://caspervonb.github.io/2014/03/05/ecmascript6-features-and-tools.html)
+- Stoyan Stefanov, [Writing ES6 today with jstransform](http://www.phpied.com/writing-es6-today-with-jstransform/)
diff --git a/_site/docs/set-map.md b/_site/docs/set-map.md
new file mode 100644
index 0000000..26f1ad4
--- /dev/null
+++ b/_site/docs/set-map.md
@@ -0,0 +1,270 @@
+# Set和Map数据结构
+
+## Set
+
+ES6提供了新的数据结构Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。
+
+Set本身是一个构造函数，用来生成Set数据结构。
+
+```javascript
+
+var s = new Set();
+
+[2,3,5,4,5,2,2].map(x => s.add(x))
+
+for (i of s) {console.log(i)}
+// 2 3 4 5
+
+```
+
+上面代码通过add方法向Set结构加入成员，结果表明set结构不会添加重复的值。
+
+Set函数接受一个数组作为参数，用来初始化。
+
+```javascript
+
+var items = new Set([1,2,3,4,5,5,5,5]);
+
+items.size()
+// 5
+
+```
+
+向Set加入值的时候，不会发生类型转换。这意味在Set中，5和“5”是两个不同的值。
+
+set数据结构有以下方法。
+
+- size()：返回成员总数。
+- add(value)：添加某个值。
+- delete(value)：删除某个值。
+- has(value)：返回一个布尔值，表示该值是否为set的成员。
+- clear()：清除所有成员。
+
+下面是这些属性和方法的使用演示。
+
+```javascript
+
+s.add(1).add(2).add(2);
+// 注意2被加入了两次
+
+s.size() // 2
+
+s.has(1) // true
+s.has(2) // true
+s.has(3) // false
+
+s.delete(2);
+s.has(2) // false
+
+```
+
+下面是一个对比，看看在判断是否包括一个键上面，对象和Set的写法不同。
+
+```javascript
+
+// 对象的写法
+
+var properties = {
+ "width": 1,
+ "height": 1
+};
+
+if (properties[someName]) {
+ // do something
+}
+
+// Set的写法
+
+var properties = new Set();
+
+properties.add("width");
+properties.add("height");
+
+if (properties.has(someName)) {
+ // do something
+}
+
+```
+
+Array.from方法可以将Set结构转为数组。
+
+```javascript
+
+var items = new Set([1, 2, 3, 4, 5]);
+var array = Array.from(items);
+
+```
+
+这就提供了一种去除数组中重复元素的方法。
+
+```javascript
+
+function dedupe(array) {
+ return Array.from(new Set(array));
+}
+
+```
+
+## Map
+
+JavaScript的对象，本质上是键值对的集合，但是只能用字符串当作键。这给它的使用带来了很大的限制。
+
+```javascript
+
+var data = {};
+var element = document.getElementById("myDiv");
+
+data[element] = metadata;
+
+```
+
+上面代码原意是将一个DOM节点作为对象data的键，但是由于对象只接受字符串作为键名，所以element被自动转为字符串“[Object HTMLDivElement]”。
+
+为了解决这个问题，ES6提供了map数据结构。它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，对象也可以当作键。
+
+```javascript
+
+var m = new Map();
+
+o = {p: "Hello World"};
+
+m.set(o, "content")
+
+console.log(m.get(o))
+// "content"
+
+```
+
+上面代码将对象o当作m的一个键。
+
+Map函数也可以接受一个数组进行初始化。
+
+```javascript
+
+var map = new Map([ ["name", "张三"], ["title", "Author"]]);
+
+map.size // 2
+map.has("name") // true
+map.get("name") // "张三"
+map.has("title") // true
+map.get("title") // "Author"
+
+```
+
+Map数据结构有以下属性和方法。
+
+- size：返回成员总数。
+- set(key, value)：设置一个键值对。
+- get(key)：读取一个键。
+- has(key)：返回一个布尔值，表示某个键是否在Map数据结构中。
+- delete(key)：删除某个键。
+- clear()：清除所有成员。
+- keys()：返回键名的遍历器。
+- values()：返回键值的遍历器。
+- entries()：返回所有成员的遍历器。
+
+下面是一些用法实例。
+
+```javascript
+
+var m = new Map();
+
+m.set("edition", 6) // 键是字符串
+m.set(262, "standard") // 键是数值
+m.set(undefined, "nah") // 键是undefined
+
+var hello = function() {console.log("hello");}
+m.set(hello, "Hello ES6!") // 键是函数
+
+m.has("edition") // true
+m.has("years") // false
+m.has(262) // true
+m.has(undefined) // true
+m.has(hello) // true
+
+m.delete(undefined)
+m.has(undefined) // false
+
+m.get(hello) // Hello ES6!
+m.get("edition") // 6
+
+```
+
+运用Map结构原生提供的三个遍历器，可以遍历所有成员。
+
+```javascript
+
+for (let key of map.keys()) {
+ console.log("Key: %s", key);
+}
+
+for (let value of map.values()) {
+ console.log("Value: %s", value);
+}
+
+for (let item of map.entries()) {
+ console.log("Key: %s, Value: %s", item[0], item[1]);
+}
+
+// same as using map.entries()
+for (let item of map) {
+ console.log("Key: %s, Value: %s", item[0], item[1]);
+}
+
+```
+
+Map结构还有一个forEach方法，与数组的forEach方法类似，也可以实现遍历。
+
+```javascript
+
+map.forEach(function(value, key, map)) {
+ console.log("Key: %s, Value: %s", key, value);
+});
+
+```
+
+forEach方法还可以接受第二个参数，用来绑定this。
+
+```javascript
+
+var reporter = {
+ report: function(key, value) {
+ console.log("Key: %s, Value: %s", key, value);
+ }
+};
+
+map.forEach(function(value, key, map) {
+ this.report(key, value);
+}, reporter);
+
+```
+
+上面代码中，forEach方法的回调函数的this，就指向reporter。
+
+## WeakMap
+
+WeakMap结构与Map结构基本类似，唯一的区别是它只接受对象作为键名（null除外），不接受原始类型的值作为键名。
+
+WeakMap的设计目的在于，键名是对象的弱引用（垃圾回收机制不将该引用考虑在内），所以其所对应的对象可能会被自动回收。当对象被回收后，WeakMap自动移除对应的键值对。典型应用是，一个对应DOM元素的WeakMap结构，当某个DOM元素被清除，其所对应的WeakMap记录就会自动被移除。基本上，WeakMap的专用场合就是，它的键所对应的对象，可能会在将来消失。
+
+下面是WeakMap结构的一个例子，可以看到用法上与Map几乎一样。
+
+```javascript
+
+var map = new WeakMap();
+var element = document.querySelector(".element");
+
+map.set(element, "Original");
+
+var value = map.get(element);
+console.log(value); // "Original"
+
+element.parentNode.removeChild(element);
+element = null;
+
+value = map.get(element);
+console.log(value); // undefined
+
+```
+
+WeakMap还有has和delete方法，但没有size方法，也无法遍历它的值，这与WeakMap的键被垃圾回收机制忽略有关。
diff --git a/_site/docs/string.md b/_site/docs/string.md
new file mode 100644
index 0000000..b65eed2
--- /dev/null
+++ b/_site/docs/string.md
@@ -0,0 +1,249 @@
+# 字符串的扩展
+
+ES6加强了对Unicode的支持，并且扩展了字符串对象。
+
+## codePointAt方法
+
+JavaScript内部，字符以UTF-16的格式储存，每个字符固定为16字节。对于那些需要4个字节储存的字符（Unicode编号大于0xFFFF的字符），JavaScript会认为它们是两个字符。
+
+```javascript
+
+var s = "𠮷";
+
+s.length // 2
+s.charAt(0) // ''
+s.charAt(1) // ''
+s.charCodeAt(0) // 55362
+s.charCodeAt(1) // 57271
+
+```
+
+上面代码说明，对于4个字节储存的字符，JavaScript不能正确处理。
+
+ES6提供了codePointAt方法，能够正确处理4个字节储存的字符，返回一个字符的Unicode编号。，
+
+```javascript
+
+var s = "𠮷a";
+
+s.codePointAt(0) // 134071
+s.codePointAt(1) // 97
+
+s.charCodeAt(2) // 97
+
+```
+
+上面代码说明，codePointAt方法的参数是，字符在字符串中的位置。对于两个字节储存的字符，它的返回结果与charCodeAt方法相同。
+
+该方法是测试一个字符由两个字节还是由四个字节组成的最简单方法。
+
+```javascript
+
+function is32Bit(c) {
+ return c.codePointAt(0) > 0xFFFF;
+}
+
+is32Bit("𠮷") // true
+is32Bit("a") // false
+
+```
+
+## String.fromCodePoint方法
+
+该方法用于从Unicode编号返回对应的字符串，作用与codePointAt正好相反。
+
+```javascript
+
+String.fromCodePoint(134071) // "𠮷"
+
+```
+
+注意，fromCodePoint方法定义在String对象上，而codePointAt方法定义在字符串的实例对象上。
+
+## 字符的Unicode表示法
+
+JavaScript允许采用“\uxxxx”形式表示一个字符，其中“xxxx”表示字符的Unicode编号。
+
+```javascript
+
+"\u0061"
+// "a"
+
+```
+
+但是，这种表示法只限于\u0000——\uFFFF之间的字符。超出这个范围的字符，必须写成两个字节的形式。
+
+```javascript
+
+"\uD842\uDFB7"
+// "𠮷"
+
+"\u20BB7"
+// " 7"
+
+```
+
+上面代码表示，如果直接在“\u”后面跟上超过0xFFFF的数值，JavaScript会理解成“\u20BB+7”。
+
+ES6对这一点做出了改进，只要将超过0xFFFF的编号放入大括号，就能正确解读该字符。
+
+```javascript
+
+"\u{20BB7}"
+// " 7"
+
+```
+
+## 正则表达式的u修饰符
+
+ES6对正则表达式添加了u修饰符，用来正确处理大于\uFFFF的Unicode字符。
+
+```javascript
+
+var s = "𠮷";
+
+/^.$/.test(s) // false
+/^.$/u.test(s) // true
+
+```
+
+上面代码表示，如果不添加u修饰符，正则表达式就会认为字符串为两个字符，从而匹配失败。
+
+利用这一点，可以写出一个正确返回字符串长度的函数。
+
+```javascript
+
+function codePointLength(text) {
+ var result = text.match(/[\s\S]/gu);
+ return result ? result.length : 0;
+}
+
+var s = "𠮷𠮷";
+
+s.length // 4
+codePointLength(s) // 2
+
+```
+
+## contains(), startsWith(), endsWith()
+
+传统上，JavaScript只有indexOf方法，可以用来确定一个字符串是否包含在另一个字符串中。ES6又提供了三种新方法。
+
+- **contains()**：返回布尔值，表示是否找到了参数字符串。
+- **startsWith()**：返回布尔值，表示参数字符串是否在源字符串的头部。
+- **endsWith()**：返回布尔值，表示参数字符串是否在源字符串的尾部。
+
+```javascript
+
+var s = "Hello world!";
+
+s.startsWith("Hello") // true
+s.endsWith("!") // true
+s.contains("o") // true
+
+```
+
+这三个方法都支持第二个参数，表示开始搜索的位置。
+
+```javascript
+
+var s = "Hello world!";
+
+s.startsWith("o", 4) // true
+s.endsWith("o", 8) // true
+s.contains("o", 8) // false
+
+```
+
+上面代码表示，使用第二个参数n时，endsWith的行为与其他两个方法有所不同。它针对前n个字符，而其他两个方法针对从第n个位置直到字符串结束。
+
+## repeat()
+
+repeat()返回一个新字符串，表示将原字符串重复n次。
+
+```javascript
+
+"x".repeat(3) // "xxx"
+"hello".repeat(2) // "hellohello"
+
+```
+
+## 正则表达式的y修饰符
+
+除了u修饰符，ES6还为正则表达式添加了y修饰符，叫做“粘连”（sticky）修饰符。它的作用与g修饰符类似，也是全局匹配，后一次匹配都从上一次匹配成功的下一个位置开始，不同之处在于，g修饰符只确保剩余位置中存在匹配，而y修饰符确保匹配必须从剩余的第一个位置开始，这也就是“粘连”的涵义。
+
+```javascript
+
+var s = "aaa_aa_a";
+var r1 = /a+/g;
+var r2 = /a+/y;
+
+r1.exec(s) // ["aaa"]
+r2.exec(s) // ["aaa"]
+
+r1.exec(s) // ["aa"]
+r2.exec(s) // null
+
+```
+
+上面代码有两个正则表达式，一个使用g修饰符，另一个使用y修饰符。这两个正则表达式各执行了两次，第一次执行的时候，两者行为相同，剩余字符串都是“_aa_a”。由于g修饰没有位置要求，所以第二次执行会返回结果，而y修饰符要求匹配必须从头部开始，所以返回null。
+
+如果改一下正则表达式，保证每次都能头部匹配，y修饰符就会返回结果了。
+
+```javascript
+
+var s = "aaa_aa_a";
+var r = /a+_/y;
+
+r.exec(s) // ["aaa_"]
+r.exec(s) // ["aa_"]
+
+```
+
+上面代码每次匹配，都是从剩余字符串的头部开始。
+
+进一步说，y修饰符号隐含了头部匹配的标志ˆ。
+
+```javascript
+
+/b/y.exec("aba")
+// null
+
+```
+
+上面代码由于不能保证头部匹配，所以返回null。y修饰符的设计本意，就是让头部匹配的标志ˆ在全局匹配中都有效。
+
+与y修饰符相匹配，ES6的正则对象多了sticky属性，表示是否设置了y修饰符。
+
+```javascript
+
+var r = /hello\d/y;
+r.sticky // true
+
+```
+
+## 模板字符串
+
+模板字符串（template string）是增强版的字符串，用反引号（`）标识。它可以当作普通字符串使用，也可以用来定义多行字符串，或者在字符串中嵌入变量。
+
+```javascript
+
+// 普通字符串
+`In JavaScript '\n' is a line-feed.`
+
+// 多行字符串
+`In JavaScript this is
+ not legal.`
+
+// 字符串中嵌入变量
+var name = "Bob", time = "today";
+`Hello ${name}, how are you ${time}?`
+
+var x = 1;
+var y = 2;
+console.log(`${ x } + ${ y } = ${ x + y}`)
+// "1 + 2 = 3"
+
+```
+
+上面代码表示，在模板字符串中嵌入变量，需要将变量名写在${}之中。
diff --git a/_site/favicon.ico b/_site/favicon.ico
new file mode 100644
index 0000000..bb5d13b
Binary files /dev/null and b/_site/favicon.ico differ
diff --git a/_site/images/cover.jpg b/_site/images/cover.jpg
new file mode 100755
index 0000000..3617628
Binary files /dev/null and b/_site/images/cover.jpg differ
diff --git a/_site/images/cover_thumbnail.jpg b/_site/images/cover_thumbnail.jpg
new file mode 100755
index 0000000..f4a93c5
Binary files /dev/null and b/_site/images/cover_thumbnail.jpg differ
diff --git a/_site/index.html b/_site/index.html
new file mode 100644
index 0000000..b9aacb1
--- /dev/null
+++ b/_site/index.html
@@ -0,0 +1,46 @@
+
+
+
+ ECMAScript 6入门
+
+
+ back to top
+ edit
+ Loading ...
+ Opps! ... File not found!
+
+
+
+ 《ECMAScript 6入门》是一本开源的JavaScript语言教程，全面介绍ECMAScript 6新增的语法特性。
+ 本书力争覆盖ES6与ES5的所有不同之处，对涉及的语法知识给予详细介绍，并给出大量简洁易懂的示例代码。
+ 本书为中级难度，适合已有一定JavaScript语言基础的读者，了解这门语言的最新进展；也可当作参考手册，查寻新增的语法点。
+
+
+
diff --git a/_site/js/ditto.js b/_site/js/ditto.js
new file mode 100644
index 0000000..4f190c1
--- /dev/null
+++ b/_site/js/ditto.js
@@ -0,0 +1,234 @@
+var ditto = {
+ // page element ids
+ content_id: "#content",
+ sidebar_id: "#sidebar",
+ edit_id: "#edit",
+ back_to_top_id: "#back_to_top",
+ loading_id: "#loading",
+ error_id: "#error",
+
+ // display elements
+ sidebar: true,
+ edit_button: true,
+ back_to_top_button: true,
+
+ // initialize function
+ run: initialize
+};
+
+var disqusCode = '留言 ';
+
+function initialize() {
+ // initialize sidebar and buttons
+ if (ditto.sidebar) {
+ init_sidebar_section();
+ }
+
+ if (ditto.back_to_top_button) {
+ init_back_to_top_button();
+ }
+
+ if (ditto.edit_button) {
+ init_edit_button();
+ }
+
+ // page router
+ router();
+ $(window).on('hashchange', router);
+}
+
+function init_sidebar_section() {
+ $.get(ditto.sidebar_file, function(data) {
+ $(ditto.sidebar_id).html(marked(data));
+ }, "text").fail(function() {
+ alert("Opps! can't find the sidebar file to display!");
+ });
+
+}
+
+function init_back_to_top_button() {
+ $(ditto.back_to_top_id).show();
+ $(ditto.back_to_top_id).on("click", function() {
+ $("html body").animate({
+ scrollTop: 0
+ }, 200);
+ });
+}
+
+function init_edit_button() {
+ if (ditto.base_url === null) {
+ alert("Error! You didn't set 'base_url' when calling ditto.run()!");
+
+ } else {
+ $(ditto.edit_id).show();
+ $(ditto.edit_id).on("click", function() {
+ var hash = location.hash.replace("#", "/");
+
+ if (hash === "") {
+ hash = "/" + ditto.index.replace(".md", "");
+ }
+
+ window.open(ditto.base_url + hash + ".md");
+ // open is better than redirecting, as the previous page history
+ // with redirect is a bit messed up
+ });
+ }
+}
+
+function replace_symbols(text) {
+ // replace symbols with underscore
+ return text.replace(/[&\/\\#,+=()$~%.'":*?<>{}\ \]\[]/g, "_");
+}
+
+function li_create_linkage(li_tag, header_level) {
+ // add custom id and class attributes
+ html_safe_tag = replace_symbols(li_tag.text());
+ li_tag.attr("id", html_safe_tag);
+ li_tag.attr("class", "link");
+
+ // add click listener - on click scroll to relevant header section
+ $(ditto.content_id + " li#" + li_tag.attr("id")).click(function() {
+ // scroll to relevant section
+ var header = $(
+ ditto.content_id + " h" + header_level + "." + li_tag.attr("id")
+ );
+ $('html, body').animate({
+ scrollTop: header.offset().top
+ }, 200);
+
+ // highlight the relevant section
+ original_color = header.css("color");
+ header.animate({ color: "#ED1C24", }, 500, function() {
+ // revert back to orig color
+ $(this).animate({color: original_color}, 2500);
+ });
+ });
+}
+
+function create_page_anchors() {
+ // create page anchors by matching li's to headers
+ // if there is a match, create click listeners
+ // and scroll to relevant sections
+
+ // go through header level 1 to 3
+ for (var i = 1; i <= 4; i++) {
+ // parse all headers
+ var headers = [];
+ $('#content h' + i).map(function() {
+ headers.push($(this).text());
+ $(this).addClass(replace_symbols($(this).text()));
+ this.id = 'h'+i+'-'+replace_symbols($(this).text());
+ });
+
+ if ((i === 2) && headers.length !== 0){
+ var ul_tag = $('])*?>/)(/tag/g,block._tag)();block.paragraph=replace(block.paragraph)("hr",block.hr)("heading",block.heading)("lheading",block.lheading)("blockquote",block.blockquote)("tag","<"+block._tag)("def",block.def)();block.normal=merge({},block);block.gfm=merge({},block.normal,{fences:/^ *(`{3,}|~{3,}) *(\S+)? *\n([\s\S]+?)\s*\1 *(?:\n+|$)/,paragraph:/^/});block.gfm.paragraph=replace(block.paragraph)("(?!","(?!"+block.gfm.fences.source.replace("\\1","\\2")+"|"+block.list.source.replace("\\1","\\3")+"|")();block.tables=merge({},block.gfm,{nptable:/^ *(\S.*\|.*)\n *([-:]+ *\|[-| :]*)\n((?:.*\|.*(?:\n|$))*)\n*/,table:/^ *\|(.+)\n *\|( *[-:]+[-| :]*)\n((?: *\|.*(?:\n|$))*)\n*/});function Lexer(options){this.tokens=[];this.tokens.links={};this.options=options||marked.defaults;this.rules=block.normal;if(this.options.gfm){if(this.options.tables){this.rules=block.tables}else{this.rules=block.gfm}}}Lexer.rules=block;Lexer.lex=function(src,options){var lexer=new Lexer(options);return lexer.lex(src)};Lexer.prototype.lex=function(src){src=src.replace(/\r\n|\r/g,"\n").replace(/\t/g," ").replace(/\u00a0/g," ").replace(/\u2424/g,"\n");return this.token(src,true)};Lexer.prototype.token=function(src,top,bq){var src=src.replace(/^ +$/gm,""),next,loose,cap,bull,b,item,space,i,l;while(src){if(cap=this.rules.newline.exec(src)){src=src.substring(cap[0].length);if(cap[0].length>1){this.tokens.push({type:"space"})}}if(cap=this.rules.code.exec(src)){src=src.substring(cap[0].length);cap=cap[0].replace(/^ {4}/gm,"");this.tokens.push({type:"code",text:!this.options.pedantic?cap.replace(/\n+$/,""):cap});continue}if(cap=this.rules.fences.exec(src)){src=src.substring(cap[0].length);this.tokens.push({type:"code",lang:cap[2],text:cap[3]});continue}if(cap=this.rules.heading.exec(src)){src=src.substring(cap[0].length);this.tokens.push({type:"heading",depth:cap[1].length,text:cap[2]});continue}if(top&&(cap=this.rules.nptable.exec(src))){src=src.substring(cap[0].length);item={type:"table",header:cap[1].replace(/^ *| *\| *$/g,"").split(/ *\| */),align:cap[2].replace(/^ *|\| *$/g,"").split(/ *\| */),cells:cap[3].replace(/\n$/,"").split("\n")};for(i=0;i ?/gm,"");this.token(cap,top,true);this.tokens.push({type:"blockquote_end"});continue}if(cap=this.rules.list.exec(src)){src=src.substring(cap[0].length);bull=cap[2];this.tokens.push({type:"list_start",ordered:bull.length>1});cap=cap[0].match(this.rules.item);next=false;l=cap.length;i=0;for(;i1&&b.length>1)){src=cap.slice(i+1).join("\n")+src;i=l-1}}loose=next||/\n\n(?!\s*$)/.test(item);if(i!==l-1){next=item.charAt(item.length-1)==="\n";if(!loose)loose=next}this.tokens.push({type:loose?"loose_item_start":"list_item_start"});this.token(item,false,bq);this.tokens.push({type:"list_item_end"})}this.tokens.push({type:"list_end"});continue}if(cap=this.rules.html.exec(src)){src=src.substring(cap[0].length);this.tokens.push({type:this.options.sanitize?"paragraph":"html",pre:cap[1]==="pre"||cap[1]==="script"||cap[1]==="style",text:cap[0]});continue}if(!bq&&top&&(cap=this.rules.def.exec(src))){src=src.substring(cap[0].length);this.tokens.links[cap[1].toLowerCase()]={href:cap[2],title:cap[3]};continue}if(top&&(cap=this.rules.table.exec(src))){src=src.substring(cap[0].length);item={type:"table",header:cap[1].replace(/^ *| *\| *$/g,"").split(/ *\| */),align:cap[2].replace(/^ *|\| *$/g,"").split(/ *\| */),cells:cap[3].replace(/(?: *\| *)?\n$/,"").split("\n")};for(i=0;i])/,autolink:/^<([^ >]+(@|:\/)[^ >]+)>/,url:noop,tag:/^|^<\/?\w+(?:"[^"]*"|'[^']*'|[^'">])*?>/,link:/^!?\[(inside)\]\(href\)/,reflink:/^!?\[(inside)\]\s*\[([^\]]*)\]/,nolink:/^!?\[((?:\[[^\]]*\]|[^\[\]])*)\]/,strong:/^__([\s\S]+?)__(?!_)|^\*\*([\s\S]+?)\*\*(?!\*)/,em:/^\b_((?:__|[\s\S])+?)_\b|^\*((?:\*\*|[\s\S])+?)\*(?!\*)/,code:/^(`+)\s*([\s\S]*?[^`])\s*\1(?!`)/,br:/^ {2,}\n(?!\s*$)/,del:noop,text:/^[\s\S]+?(?=[\\?(?:\s+['"]([\s\S]*?)['"])?\s*/;inline.link=replace(inline.link)("inside",inline._inside)("href",inline._href)();inline.reflink=replace(inline.reflink)("inside",inline._inside)();inline.normal=merge({},inline);inline.pedantic=merge({},inline.normal,{strong:/^__(?=\S)([\s\S]*?\S)__(?!_)|^\*\*(?=\S)([\s\S]*?\S)\*\*(?!\*)/,em:/^_(?=\S)([\s\S]*?\S)_(?!_)|^\*(?=\S)([\s\S]*?\S)\*(?!\*)/});inline.gfm=merge({},inline.normal,{escape:replace(inline.escape)("])","~|])")(),url:/^(https?:\/\/[^\s<]+[^<.,:;"')\]\s])/,del:/^~~(?=\S)([\s\S]*?\S)~~/,text:replace(inline.text)("]|","~]|")("|","|https?://|")()});inline.breaks=merge({},inline.gfm,{br:replace(inline.br)("{2,}","*")(),text:replace(inline.gfm.text)("{2,}","*")()});function InlineLexer(links,options){this.options=options||marked.defaults;this.links=links;this.rules=inline.normal;this.renderer=this.options.renderer||new Renderer;this.renderer.options=this.options;if(!this.links){throw new Error("Tokens array requires a `links` property.")}if(this.options.gfm){if(this.options.breaks){this.rules=inline.breaks}else{this.rules=inline.gfm}}else if(this.options.pedantic){this.rules=inline.pedantic}}InlineLexer.rules=inline;InlineLexer.output=function(src,links,options){var inline=new InlineLexer(links,options);return inline.output(src)};InlineLexer.prototype.output=function(src){var out="",link,text,href,cap;while(src){if(cap=this.rules.escape.exec(src)){src=src.substring(cap[0].length);out+=cap[1];continue}if(cap=this.rules.autolink.exec(src)){src=src.substring(cap[0].length);if(cap[2]==="@"){text=cap[1].charAt(6)===":"?this.mangle(cap[1].substring(7)):this.mangle(cap[1]);href=this.mangle("mailto:")+text}else{text=escape(cap[1]);href=text}out+=this.renderer.link(href,null,text);continue}if(!this.inLink&&(cap=this.rules.url.exec(src))){src=src.substring(cap[0].length);text=escape(cap[1]);href=text;out+=this.renderer.link(href,null,text);continue}if(cap=this.rules.tag.exec(src)){if(!this.inLink&&/^/i.test(cap[0])){this.inLink=false}src=src.substring(cap[0].length);out+=this.options.sanitize?escape(cap[0]):cap[0];continue}if(cap=this.rules.link.exec(src)){src=src.substring(cap[0].length);this.inLink=true;out+=this.outputLink(cap,{href:cap[2],title:cap[3]});this.inLink=false;continue}if((cap=this.rules.reflink.exec(src))||(cap=this.rules.nolink.exec(src))){src=src.substring(cap[0].length);link=(cap[2]||cap[1]).replace(/\s+/g," ");link=this.links[link.toLowerCase()];if(!link||!link.href){out+=cap[0].charAt(0);src=cap[0].substring(1)+src;continue}this.inLink=true;out+=this.outputLink(cap,link);this.inLink=false;continue}if(cap=this.rules.strong.exec(src)){src=src.substring(cap[0].length);out+=this.renderer.strong(this.output(cap[2]||cap[1]));continue}if(cap=this.rules.em.exec(src)){src=src.substring(cap[0].length);out+=this.renderer.em(this.output(cap[2]||cap[1]));continue}if(cap=this.rules.code.exec(src)){src=src.substring(cap[0].length);out+=this.renderer.codespan(escape(cap[2],true));continue}if(cap=this.rules.br.exec(src)){src=src.substring(cap[0].length);out+=this.renderer.br();continue}if(cap=this.rules.del.exec(src)){src=src.substring(cap[0].length);out+=this.renderer.del(this.output(cap[1]));continue}if(cap=this.rules.text.exec(src)){src=src.substring(cap[0].length);out+=escape(this.smartypants(cap[0]));continue}if(src){throw new Error("Infinite loop on byte: "+src.charCodeAt(0))}}return out};InlineLexer.prototype.outputLink=function(cap,link){var href=escape(link.href),title=link.title?escape(link.title):null;return cap[0].charAt(0)!=="!"?this.renderer.link(href,title,this.output(cap[1])):this.renderer.image(href,title,escape(cap[1]))};InlineLexer.prototype.smartypants=function(text){if(!this.options.smartypants)return text;return text.replace(/--/g,"—").replace(/(^|[-\u2014/(\[{"\s])'/g,"$1‘").replace(/'/g,"’").replace(/(^|[-\u2014/(\[{\u2018\s])"/g,"$1“").replace(/"/g,"”").replace(/\.{3}/g,"…")};InlineLexer.prototype.mangle=function(text){var out="",l=text.length,i=0,ch;for(;i.5){ch="x"+ch.toString(16)}out+="&#"+ch+";"}return out};function Renderer(options){this.options=options||{}}Renderer.prototype.code=function(code,lang,escaped){if(this.options.highlight){var out=this.options.highlight(code,lang);if(out!=null&&out!==code){escaped=true;code=out}}if(!lang){return""+(escaped?code:escape(code,true))+"\n'+(escaped?code:escape(code,true))+"\n\n"+quote+" \n"};Renderer.prototype.html=function(html){return html};Renderer.prototype.heading=function(text,level,raw){return"