diff --git a/.gitignore b/.gitignore new file mode 100644 index 000000000..04139fcbb --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +.DS_Store +.travis.yml diff --git a/.sass-cache/3ce404268018a119c6b375f80319b1ab0036e9af/fonts.scssc b/.sass-cache/3ce404268018a119c6b375f80319b1ab0036e9af/fonts.scssc new file mode 100644 index 000000000..ec7fdcf34 Binary files /dev/null and b/.sass-cache/3ce404268018a119c6b375f80319b1ab0036e9af/fonts.scssc differ diff --git a/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_base.scssc b/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_base.scssc new file mode 100644 index 000000000..fb2a918be Binary files /dev/null and b/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_base.scssc differ diff --git a/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_reset.scssc b/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_reset.scssc new file mode 100644 index 000000000..e42779621 Binary files /dev/null and b/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_reset.scssc differ diff --git a/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_site.scssc b/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_site.scssc new file mode 100644 index 000000000..0b9160405 Binary files /dev/null and b/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_site.scssc differ diff --git a/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_syntax.scssc b/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_syntax.scssc new file mode 100644 index 000000000..a68f3208b Binary files /dev/null and b/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_syntax.scssc differ diff --git a/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_utilities.scssc b/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_utilities.scssc new file mode 100644 index 000000000..f5beabcb6 Binary files /dev/null and b/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_utilities.scssc differ diff --git a/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_variables.scssc b/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_variables.scssc new file mode 100644 index 000000000..259448e9a Binary files /dev/null and b/.sass-cache/8bff368283b81efce96bb7edd6c18100ac4f2131/_variables.scssc differ diff --git a/.sass-cache/90598ad867a0f2c6a5397ae777feb5501df9cf83/_settings.scssc b/.sass-cache/90598ad867a0f2c6a5397ae777feb5501df9cf83/_settings.scssc new file mode 100644 index 000000000..2895d22c9 Binary files /dev/null and b/.sass-cache/90598ad867a0f2c6a5397ae777feb5501df9cf83/_settings.scssc differ diff --git a/.sass-cache/90598ad867a0f2c6a5397ae777feb5501df9cf83/magnific-popup.scssc b/.sass-cache/90598ad867a0f2c6a5397ae777feb5501df9cf83/magnific-popup.scssc new file mode 100644 index 000000000..eb6a703d2 Binary files /dev/null and b/.sass-cache/90598ad867a0f2c6a5397ae777feb5501df9cf83/magnific-popup.scssc differ diff --git a/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_animated.scssc b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_animated.scssc new file mode 100644 index 000000000..e00d2d80b Binary files /dev/null and b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_animated.scssc differ diff --git a/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_bordered-pulled.scssc b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_bordered-pulled.scssc new file mode 100644 index 000000000..e572ada6a Binary files /dev/null and b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_bordered-pulled.scssc differ diff --git a/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_core.scssc b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_core.scssc new file mode 100644 index 000000000..5106114a0 Binary files /dev/null and b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_core.scssc differ diff --git a/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_fixed-width.scssc b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_fixed-width.scssc new file mode 100644 index 000000000..8f3698a25 Binary files /dev/null and b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_fixed-width.scssc differ diff --git a/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_icons.scssc b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_icons.scssc new file mode 100644 index 000000000..20edb7b80 Binary files /dev/null and b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_icons.scssc differ diff --git a/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_larger.scssc b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_larger.scssc new file mode 100644 index 000000000..a44ce6bf3 Binary files /dev/null and b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_larger.scssc differ diff --git a/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_list.scssc b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_list.scssc new file mode 100644 index 000000000..76dcf4a37 Binary files /dev/null and b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_list.scssc differ diff --git a/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_mixins.scssc b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_mixins.scssc new file mode 100644 index 000000000..4fb87c060 Binary files /dev/null and b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_mixins.scssc differ diff --git a/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_path.scssc b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_path.scssc new file mode 100644 index 000000000..98630bbbe Binary files /dev/null and b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_path.scssc differ diff --git a/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_rotated-flipped.scssc b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_rotated-flipped.scssc new file mode 100644 index 000000000..4b5173974 Binary files /dev/null and b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_rotated-flipped.scssc differ diff --git a/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_screen-reader.scssc b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_screen-reader.scssc new file mode 100644 index 000000000..7358a15d5 Binary files /dev/null and b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_screen-reader.scssc differ diff --git a/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_stacked.scssc b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_stacked.scssc new file mode 100644 index 000000000..e1233eb23 Binary files /dev/null and b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_stacked.scssc differ diff --git a/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_variables.scssc b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_variables.scssc new file mode 100644 index 000000000..b107d46fe Binary files /dev/null and b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/_variables.scssc differ diff --git a/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/font-awesome.scssc b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/font-awesome.scssc new file mode 100644 index 000000000..20408e6e1 Binary files /dev/null and b/.sass-cache/aa667271a99ab146c31b3ada801eeab71a45b2b2/font-awesome.scssc differ diff --git a/.travis.yml b/.travis.yml new file mode 100644 index 000000000..dcf800cb6 --- /dev/null +++ b/.travis.yml @@ -0,0 +1,10 @@ +language: ruby +rvm: +- 2.4.1 +before_script: +- chmod +x ./script/cibuild +script: "./script/cibuild" +sudo: false +cache: bundler +notifications: + email: false diff --git a/Gemfile b/Gemfile index 8ec65387a..9c50e87fc 100644 --- a/Gemfile +++ b/Gemfile @@ -1,5 +1,9 @@ source 'https://rubygems.org' gem 'jekyll' -gem 'jekyll-sitemap' -gem 'jekyll-feed' -gem "jekyll-gist" + +group :jekyll_plugins do + gem 'jekyll-feed' + gem 'jekyll-sitemap' + gem 'jekyll-gist' + gem 'jekyll-paginate-v2' +end diff --git a/Gemfile.lock b/Gemfile.lock index 71622835c..535ebff85 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -1,55 +1,86 @@ GEM remote: https://rubygems.org/ specs: - addressable (2.4.0) - colorator (0.1) - faraday (0.9.2) + addressable (2.6.0) + public_suffix (>= 2.0.2, < 4.0) + colorator (1.1.0) + concurrent-ruby (1.1.5) + em-websocket (0.5.1) + eventmachine (>= 0.12.9) + http_parser.rb (~> 0.6.0) + eventmachine (1.2.7) + eventmachine (1.2.7-x64-mingw32) + faraday (0.15.4) multipart-post (>= 1.2, < 3) - ffi (1.9.10) - jekyll (3.1.2) - colorator (~> 0.1) + ffi (1.11.1) + ffi (1.11.1-x64-mingw32) + forwardable-extended (2.6.0) + http_parser.rb (0.6.0) + i18n (0.9.5) + concurrent-ruby (~> 1.0) + jekyll (3.8.6) + addressable (~> 2.4) + colorator (~> 1.0) + em-websocket (~> 0.5) + i18n (~> 0.7) jekyll-sass-converter (~> 1.0) - jekyll-watch (~> 1.1) - kramdown (~> 1.3) - liquid (~> 3.0) + jekyll-watch (~> 2.0) + kramdown (~> 1.14) + liquid (~> 4.0) mercenary (~> 0.3.3) - rouge (~> 1.7) + pathutil (~> 0.9) + rouge (>= 1.7, < 4) safe_yaml (~> 1.0) - jekyll-feed (0.4.0) - jekyll-gist (1.4.0) + jekyll-feed (0.12.1) + jekyll (>= 3.7, < 5.0) + jekyll-gist (1.5.0) octokit (~> 4.2) - jekyll-sass-converter (1.4.0) + jekyll-paginate-v2 (2.0.0) + jekyll (~> 3.0) + jekyll-sass-converter (1.5.2) sass (~> 3.4) - jekyll-sitemap (0.10.0) - jekyll-watch (1.3.1) - listen (~> 3.0, < 3.1) - kramdown (1.10.0) - liquid (3.0.6) - listen (3.0.5) + jekyll-sitemap (1.3.1) + jekyll (>= 3.7, < 5.0) + jekyll-watch (2.2.1) + listen (~> 3.0) + kramdown (1.17.0) + liquid (4.0.3) + listen (3.1.5) rb-fsevent (~> 0.9, >= 0.9.4) rb-inotify (~> 0.9, >= 0.9.7) - mercenary (0.3.5) - multipart-post (2.0.0) - octokit (4.3.0) - sawyer (~> 0.7.0, >= 0.5.3) - rb-fsevent (0.9.7) - rb-inotify (0.9.5) - ffi (>= 0.5.0) - rouge (1.10.1) - safe_yaml (1.0.4) - sass (3.4.21) - sawyer (0.7.0) - addressable (>= 2.3.5, < 2.5) - faraday (~> 0.8, < 0.10) + ruby_dep (~> 1.2) + mercenary (0.3.6) + multipart-post (2.1.1) + octokit (4.14.0) + sawyer (~> 0.8.0, >= 0.5.3) + pathutil (0.16.2) + forwardable-extended (~> 2.6) + public_suffix (3.1.1) + rb-fsevent (0.10.3) + rb-inotify (0.10.0) + ffi (~> 1.0) + rouge (3.8.0) + ruby_dep (1.5.0) + safe_yaml (1.0.5) + sass (3.7.4) + sass-listen (~> 4.0.0) + sass-listen (4.0.0) + rb-fsevent (~> 0.9, >= 0.9.4) + rb-inotify (~> 0.9, >= 0.9.7) + sawyer (0.8.2) + addressable (>= 2.3.5) + faraday (> 0.8, < 2.0) PLATFORMS ruby + x64-mingw32 DEPENDENCIES jekyll jekyll-feed jekyll-gist + jekyll-paginate-v2 jekyll-sitemap BUNDLED WITH - 1.12.4 + 1.17.3 diff --git a/README.md b/README.md index 03841122f..8303e16fe 100644 --- a/README.md +++ b/README.md @@ -1,17 +1,8 @@ # Halve [![Donate](https://img.shields.io/badge/paypal-donate-blue.svg)](https://www.paypal.me/taylantatli/0usd) -## `Sorry guys but there will be no update until I buy a new laptop.` +## Hi, this is my personal blog/ portfolio page. -This theme is Jekyll port of [vangeltzo.com](http://vangeltzo.com/) (by [Vangelis Tzortzis](https://github.com/srekoble)). - -To learn how to install and use this theme check out the [installation guide](https://taylantatli.github.io/Halve/halve-theme/) for more information. - -If you have a question, find a bug, or just want to say hi, please open an [issue on GitHub](https://github.com/TaylanTatli/Halve/issues/new). - -## Preview -![screenshot of Halve](/images/halve-home-image.png) - -See a [live version of Halve](http://taylantatli.github.io/Halve) hosted on GitHub. +I forked from TaylanTatli/Halve and applied Jekyll port of [vangeltzo.com](http://vangeltzo.com/) (by [Vangelis Tzortzis](https://github.com/srekoble)). Thank you all for the great work and the share. # Credits - Original Work: [Vangelis Tzortzis](https://github.com/srekoble) diff --git a/_config.yml b/_config.yml index 1cdce98aa..3b59688b9 100644 --- a/_config.yml +++ b/_config.yml @@ -1,19 +1,24 @@ # Site -title: Halve -description: Stylish, Two-Column Jekyll Theme -url: https://taylantatli.github.io/Halve -logo: halve.png # Site logo +title: Inaheaven +description: Personal Portfolio +url: https://inaheaven.github.io/home +logo: /logo/inaheaven_logo.png # Site logo locale: en_US # Left Block Images background: - homepage: images/home.png # this image will be shown on homepage's left block - post-list: images/unsplash-image-10.jpg # this image will be shown on post list page - default-post: images/unsplash-gallery-image-3.jpg # this image will be shown when post's front matter doesn't specify any image + homepage: images/background/background_6.jpeg # this image will be shown on homepage's left block + post-list: images/background/background_9.jpeg # this image will be shown on post list page + default-post: images/background/background_11.jpeg # this image will be shown when post's front matter doesn't specify any image # Jekyll -permalink: /:title/ +permalink: /:categories/:year/:month/:day/:title markdown: kramdown +plugins: + - jekyll-feed + - jekyll-sitemap + - jekyll-gist + - jekyll-paginate-v2 highlighter: rouge kramdown: auto_ids: true @@ -29,12 +34,12 @@ sass: #google-analytics: UA-XXXXX-Y # Social Links -#email: email +email: sangmin.rim@gmail.com #google.plus: username -twitter: username +#twitter: username #facebook: username -github: username -stackoverflow: 123456/username from a "http://stackoverflow.com/users/123456/username" link +github: inaheaven +#stackoverflow: 123456/username from a "http://stackoverflow.com/users/123456/username" link #linkedin: username #xing: username #instagram: username @@ -52,14 +57,27 @@ stackoverflow: 123456/username from a "http://stackoverflow.com/users/1234 #keybase: username #xmpp: username@server.com #hackernews: username -behance: username +#behance: username -# Gems -gems: - - jekyll-feed - - jekyll-sitemap - - jekyll-gist +# Gems Has Been Deprecated +#gems: +# - jekyll-feed +# - jekyll-sitemap +# - jekyll-gist +# - jekyll-paginate-v2 # Exclude list include: [_pages] exclude: [README.md, Gemfile, Gemfile.lock, _site, src, vendor, CNAME, LICENSE, Rakefile, .sass-cache, .DS_Store] + + +# Pagination Settings +pagination: + enabled: true + per_page: 4 + sort_reverse: true + trail: + before: 2 + after: 2 + + diff --git a/_data/projects.yaml b/_data/projects.yaml index 42c54a8c2..b1e0aad2f 100644 --- a/_data/projects.yaml +++ b/_data/projects.yaml @@ -1,29 +1,39 @@ -- title: Halve Jekyll Theme - url: http://taylantatli.me/Halve - image: http://taylantatli.me/Halve/images/halve-home-image.png +- title: Stock Portfolio Optimization + url: + image: completed: false -- title: Moon Jekyll Theme - url: http://taylantatli.me/Moon - image: https://cloud.githubusercontent.com/assets/754514/14509720/61c61058-01d6-11e6-93ab-0918515ecd56.png +- title: IEEE ACCESS
Automotive ECU Data-Based
Driver’s Propensity Learning
Using Evolutionary Random Forest + url: https://ieeexplore.ieee.org/document/8693502 + image: images/project/ieee_ecu.png completed: true -- title: Ramme Jekyll Theme - url: http://taylantatli.me/Ramme - image: https://raw.githubusercontent.com/TaylanTatli/Ramme/master/assets/img/screenshot-post.png +- title: mStudio - Individual
(Ingris and Caide Systems Joint Work) + url: https://www.caidesystems.com/mstudio-individual/ + image: https://www.caidesystems.com/wp-content/uploads/2018/08/instimg_1.png completed: true -- title: Daisy Pelican Theme - url: http://taylantatli.me/Daisy-Pelican-Theme/ - image: https://raw.githubusercontent.com/TaylanTatli/Daisy-Pelican-Theme/master/Preview-1.png +- title: mStudio - Admin
(Ingris and Caide Systems Joint Work) + url: + image: images/project/mstudio_admin.png + completed: false + +- title: ingris home + url: http://www.ingris.co.kr/ + image: images/project/ingris.png completed: true -- title: Block Icon Theme - url: https://github.com/TaylanTatli/Block-Icon-Theme - image: https://raw.githubusercontent.com/TaylanTatli/Block-Icon-Theme/master/Preview.png +- title: Resume + url: + image: + completed: false + +- title: Certificates 1 + url: + image: completed: false -- title: Start Page - url: http://taylantatli.me/StartPage/ - image: https://raw.githubusercontent.com/TaylanTatli/StartPage/master/preview.png +- title: Certificates 2 + url: + image: completed: false diff --git a/_includes/head.html b/_includes/head.html index a993bef05..0ae2cad01 100644 --- a/_includes/head.html +++ b/_includes/head.html @@ -56,9 +56,9 @@ #posts.inner-post-page .block-left {background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url({{ site.url }}/{{ site.background.default-post }}) no-repeat;background-size: cover;} {% endif %} - + diff --git a/_includes/overlay.html b/_includes/overlay.html index e0829e3d9..05a189f31 100644 --- a/_includes/overlay.html +++ b/_includes/overlay.html @@ -10,7 +10,7 @@ {{ item.title }} {% unless item.completed %} -
in progress +
in progress or non-disclosure
materials {% endunless %} diff --git a/_includes/page-pagination.html b/_includes/page-pagination.html index a6b7fa3c9..b412218c1 100644 --- a/_includes/page-pagination.html +++ b/_includes/page-pagination.html @@ -1,14 +1,14 @@ -{% if page.previous or page.next %} +{% include share.html %} + -{% endif %} diff --git a/_includes/pagination.html b/_includes/pagination.html new file mode 100644 index 000000000..eeb6843bc --- /dev/null +++ b/_includes/pagination.html @@ -0,0 +1,33 @@ + + {% if paginator.total_pages > 1 %} + + {% endif %} + + + diff --git a/_includes/scripts.html b/_includes/scripts.html index 6430a8456..c2d33add5 100644 --- a/_includes/scripts.html +++ b/_includes/scripts.html @@ -1,5 +1,16 @@ + + + + + + + {% if site.google-analytics %} diff --git a/_layouts/home.html b/_layouts/home.html index f1478815d..4578540b2 100644 --- a/_layouts/home.html +++ b/_layouts/home.html @@ -20,20 +20,29 @@

{% include social-links.html %} -
- - POSTS + + +  MACHINE
LEARNING + + + WEB/APP + PROJECTS
{{ content }}
+ +
+ +
    +
    {% include overlay.html %} @@ -41,3 +50,12 @@

    + diff --git a/_layouts/post-list.html b/_layouts/ml-list.html similarity index 74% rename from _layouts/post-list.html rename to _layouts/ml-list.html index 467646ad2..90f901e08 100644 --- a/_layouts/post-list.html +++ b/_layouts/ml-list.html @@ -16,13 +16,19 @@

    {{ page.title}}/
    - + +  MACHINE
    LEARNING     + + + WEB/APP + PROJECTS
    + {% endif %} {% endfor %} + {% include pagination.html %}
    {% include overlay.html %} diff --git a/_layouts/ml.html b/_layouts/ml.html new file mode 100644 index 000000000..b5c004196 --- /dev/null +++ b/_layouts/ml.html @@ -0,0 +1,50 @@ +--- +layout: compress +--- + + + +{% include head.html %} + + +
    +
    + +
    +
     MACHINE
    LEARNING /
    +

    {{ page.title | markdownify | remove: "

    " | remove: "

    " }}

    +
      + {% for tag in page.tags %} +
    • {{ tag }}
      • + {% unless forloop.last %} + {% endunless %} + {% endfor %} +
    +
    Back to Lists /
    +
    +
    +
    + +
    + +  MACHINE
    LEARNING     + + + WEB/APP + + + + + PROJECTS + +
    +
    {% if page.date %}{{ page.date | date: '%d %b %Y' }}{% else %}❖{% endif %}
    + {{ content }} +
    + {% include page-pagination.html %} +
    +
    + {% include scripts.html %} + {% include overlay.html %} + + diff --git a/_layouts/page.html b/_layouts/page.html index 7e2da35b2..779e56a4f 100644 --- a/_layouts/page.html +++ b/_layouts/page.html @@ -20,7 +20,7 @@

    {{ page.title | markdownify | remove: "

    " | remove: {% endunless %} {% endfor %} -

    Back to posts /
    +
    Back to Lists /
    @@ -29,7 +29,8 @@

    {{ page.title | markdownify | remove: "

    " | remove:

    {% include share.html %}
    - + + @@ -37,9 +38,9 @@

    {{ page.title | markdownify | remove: "

    " | remove:

    {% if page.date %}{{ page.date | date: '%d %b %Y' }}{% else %}❖{% endif %}
    {{ content }}
    - {% include share.html %} {% include page-pagination.html %} + {% include scripts.html %} {% include overlay.html %} diff --git a/_layouts/webapp-list.html b/_layouts/webapp-list.html new file mode 100644 index 000000000..6000e6556 --- /dev/null +++ b/_layouts/webapp-list.html @@ -0,0 +1,57 @@ +--- +layout: compress +--- + + + +{% include head.html %} + + +
    +
    + +

    {{ page.title}}/ +

    +
    +
    + +
    + +  MACHINE
    LEARNING     + + + WEB/APP + + + + PROJECTS +
    +
      + {% for post in paginator.posts %} + {% if post.categories contains 'webapp' %} +
    • +

      + + {{ post.title | markdownify | remove: "

      " | remove: "

      " }}       +       + {{ post.date | date: '%d %b %Y' }} +

      +

      {{ post.excerpt | strip_html | truncatewords:10 }}

      +
        + {% for tag in post.tags %} +
      • {{ tag }}
        • + {% unless forloop.last %} + {% endunless %} + {% endfor %} +
      +
      • + {% endif %} + {% endfor %} +
    + {% include pagination.html %} +
    +
    + {% include overlay.html %} + {% include scripts.html %} + + diff --git a/_layouts/post.html b/_layouts/webapp.html similarity index 78% rename from _layouts/post.html rename to _layouts/webapp.html index 7e2da35b2..8c50bc923 100644 --- a/_layouts/post.html +++ b/_layouts/webapp.html @@ -20,24 +20,27 @@

    {{ page.title | markdownify | remove: "

    " | remove: {% endunless %} {% endfor %} -

    Back to posts /
    +
    Back to Lists /
    - - + +  MACHINE
    LEARNING     + + + WEB/APP + + PROJECTS +
    {% if page.date %}{{ page.date | date: '%d %b %Y' }}{% else %}❖{% endif %}
    {{ content }}
    - {% include share.html %} {% include page-pagination.html %}
    diff --git a/_pages/ml.md b/_pages/ml.md new file mode 100644 index 000000000..471dbd4f3 --- /dev/null +++ b/_pages/ml.md @@ -0,0 +1,11 @@ +--- +layout: ml-list +title: Machine
    Learning +description: "List of Machine Learning Posts" +permalink: /ml/ +pagination: + enabled: true + category: 'ml' +--- + + diff --git a/_pages/posts.md b/_pages/posts.md deleted file mode 100644 index 9316a75ad..000000000 --- a/_pages/posts.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -layout: post-list -title: Posts -description: "List of posts" -permalink: /posts.html ---- diff --git a/_pages/webapp.md b/_pages/webapp.md new file mode 100644 index 000000000..1b143b7be --- /dev/null +++ b/_pages/webapp.md @@ -0,0 +1,10 @@ +--- +layout: webapp-list +title: Web and Applications +description: "List of Web and Applications Posts" +permalink: /webapp/ +pagination: + enabled: true + category: 'webapp' +--- + diff --git a/_plugins/WithinCategoryPostNavigation.rb b/_plugins/WithinCategoryPostNavigation.rb new file mode 100644 index 000000000..49d78bace --- /dev/null +++ b/_plugins/WithinCategoryPostNavigation.rb @@ -0,0 +1,24 @@ +module Jekyll + class WithinCategoryPostNavigation < Generator + def generate(site) + site.categories.each_pair do |category, posts| + posts.sort! { |a,b| b <=> a} + posts.each do |post| + index = posts.index post + next_in_category = nil + previous_in_category = nil + if index + if index < posts.length - 1 + next_in_category = posts[index + 1] + end + if index > 0 + previous_in_category = posts[index - 1] + end + end + post.data["next_in_category"] = next_in_category unless next_in_category.nil? + post.data["previous_in_category"] = previous_in_category unless previous_in_category.nil? + end + end + end + end +end diff --git a/_plugins/simple_search_filter.rb b/_plugins/simple_search_filter.rb new file mode 100644 index 000000000..29d2869fb --- /dev/null +++ b/_plugins/simple_search_filter.rb @@ -0,0 +1,19 @@ +module Jekyll + module CharFilter + def remove_chars(input) + input.gsub! '\\','\' + input.gsub! /\t/, ' ' + input.strip_control_and_extended_characters + end + end +end + +Liquid::Template.register_filter(Jekyll::CharFilter) + +class String + def strip_control_and_extended_characters() + chars.each_with_object("") do |char, str| + str << char if char.ascii_only? and char.ord.between?(32,126) + end + end +end diff --git a/_site/404.html b/_site/404.html new file mode 100644 index 000000000..62011967b --- /dev/null +++ b/_site/404.html @@ -0,0 +1 @@ + Page Does Not Exist… – Inaheaven
    Posts /

    Page Does Not Exist…

    Back to Lists /
    ❖

    Twitter Facebook Google+
    diff --git a/_site/assets/css/main.css b/_site/assets/css/main.css new file mode 100644 index 000000000..352e2eb20 --- /dev/null +++ b/_site/assets/css/main.css @@ -0,0 +1,4 @@ +/*! normalize.css v4.0.0 | MIT License | github.com/necolas/normalize.css */*,*:before,*:after{box-sizing:border-box}html{font-size:18px;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}@media screen and (max-width: 750px){html{font-size:16px}}body{margin:0}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font:inherit;font-size:100%;vertical-align:baseline}::selection{color:#fff;background:#4dbe7a}::-moz-selection{color:#fff;background:#4dbe7a}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0}progress{vertical-align:baseline}template,[hidden]{display:none}a{background-color:transparent}a:active,a:hover,a:focus{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit}b,strong{font-weight:bolder}dfn{font-style:italic}h1{font-size:2em;margin:0.67em 0}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:"LiberationMonoRegular",monospace}figure{margin:0}hr{box-sizing:content-box;overflow:visible;height:1px;background-color:#dedede;border:0}button,input,select,textarea{font:inherit}optgroup{font-weight:bold}button,input,select{overflow:visible}button,input,select,textarea{margin:0}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{cursor:pointer}[disabled]{cursor:default}button,html [type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,input::-moz-focus-inner{border:0;outline:0;padding:0}button:-moz-focusring,input:-moz-focusring{outline:0}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield}[type="search"]::-webkit-search-cancel-button,[type="search"]::-webkit-search-decoration{-webkit-appearance:none}html{line-height:1;overflow:hidden}html.no-scroll{overflow:hidden}html,body{height:100%;line-height:1.2}body{font-family:"weblysleek_uilight",sans-serif;color:#2c2d33;background:#fff}a{color:#2c2d33;outline:none;text-decoration:none}a:hover,a:active,a:focus,a:visited{color:#2c2d33}table{border-collapse:collapse;border-spacing:0}caption,th,td{text-align:left;font-weight:normal;vertical-align:middle}q,blockquote{quotes:none}q:before,q:after,blockquote:before,blockquote:after{content:"";content:none}a img{border:none}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}*,*:after,*:before{box-sizing:border-box}h1,h2,h3,h4,h5,h6{margin:2rem 0 0.5rem;font-family:"weblysleek_uilight",sans-serif}h1{font-size:2em}h2{font-size:1.5em}h3{font-size:1.3em}h4{font-size:1em}h5{font-size:0.9em}h6{font-size:0.8em}figure{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;margin:2em 0;*zoom:1}figure:before,figure:after{display:table;content:"";line-height:0}figure:after{clear:both}figure figcaption{margin-bottom:0.5em;color:gray;font-size:0.85em;width:100%;text-align:center}figure img{margin-bottom:10px}figure>a{display:block;border:none !important}@media only screen and (min-width: 750px){figure.half>a,figure.half>img{width:calc(50% - 4px);float:left;margin-left:1px;margin-right:1px}figure.half figcaption{clear:left}}@media only screen and (min-width: 750px){figure.third>a,figure.third>img{width:calc(33.3% - 6px);float:left;margin-left:1px;margin-right:1px}figure.third figcaption{clear:left}}@media only screen and (max-width: 749px){figure{justify-content:center}}img{display:block;max-width:100%;width:auto;height:auto;-ms-interpolation-mode:bicubic;image-rendering:optimizeQuality;margin:0 auto}blockquote{margin:2em 1em 2em 0;padding-left:1em;padding-right:1em;font-style:italic;border-left:0.25em solid #d4d4d4}blockquote cite{font-style:italic;font-size:0.85em}blockquote cite:before{content:"\2014";padding-right:5px}cite{font-style:italic;font-size:0.85em}dt{border:1px solid #ededed;padding:0.5em;background-color:#f2f2f2;font-weight:bold}dd{padding:0.5em 1em;margin-left:0;margin-bottom:2em;border:1px solid #ededed;border-top:0}table{width:100%;border-collapse:collapse;border:1px solid #ededed;margin-bottom:1em}thead{background-color:#f2f2f2;border-bottom:1px solid #ededed}tr,td{border-bottom:1px solid #ededed}th,td{text-align:center;border-right:1px solid #ededed;padding:0.5em}th a,td a{text-decoration:none !important}th:first-child,td:first-child{text-align:left}th:last-child,td:last-child{text-align:right}.gist tr,.gist td{border-bottom:0}pre{overflow-x:auto;padding:1rem;line-height:1.5;margin:0}p>code,a>code,li>code,figcaption>code,td>code{padding:0.1rem 0.2rem;font-size:0.9em;border-radius:2px;background-color:#f2f2f2;font-family:"weblysleek_uilight",sans-serif}.block-left{float:left}.block-left .content{z-index:1;position:relative}.block-right{float:right;overflow-y:auto}.block-left,.block-right{width:50%;height:100%;position:relative;display:table}.block-left>div,.block-right>div{display:table-cell;vertical-align:middle}.block-left .content,.block-right .content{height:100%}.inactive{pointer-events:none;pointer:default}.content{padding:60px;max-width:600px;margin:0 auto}canvas{width:100%;height:100%;position:absolute;top:0;left:0;z-index:0}.projects-menu-icon{position:absolute;top:30px;right:30px;width:15px;height:15px;border:2px solid #d4d4d4;border-radius:3px;cursor:pointer;z-index:3}.projects-menu-icon:before{content:'';position:absolute;left:-19px;top:-2px;width:15px;height:15px;border:2px solid #d4d4d4;border-radius:3px}.projects-menu-icon span{position:absolute;top:15px;right:-2px;width:15px;height:15px;border:2px solid #d4d4d4;border-radius:3px}.projects-menu-icon span:before{content:'';position:absolute;left:-19px;top:-2px;width:15px;height:15px;border:2px solid #d4d4d4;border-radius:3px}.projects-menu-icon:hover{border-color:#72cc96}.projects-menu-icon:hover:before{border-color:#72cc96}.projects-menu-icon:hover span{border-color:#72cc96}.projects-menu-icon:hover span:before{border-color:#72cc96}.projects-menu-icon.active{position:fixed}.posts-menu-icon{position:absolute;top:30px;right:90px;width:20px;height:25px;border:2px solid #d4d4d4;background:#fff}.posts-menu-icon:before{content:'';width:20px;height:25px;position:absolute;right:2px;border:2px solid #d4d4d4;top:2px;background:#fff}.posts-menu-icon:after{content:'';width:20px;height:25px;border:2px solid #d4d4d4;position:absolute;right:6px;top:6px;background:#fff}.posts-menu-icon:hover{border-color:#72cc96}.posts-menu-icon:hover:before,.posts-menu-icon:hover:after{border-color:#72cc96}.ml-menu-icon{position:absolute;top:30px;right:155px;width:20px;height:25px;border:2px solid #d4d4d4;background:#fff}.ml-menu-icon:before{content:'';width:20px;height:25px;position:absolute;right:2px;border:2px solid #d4d4d4;top:2px;background:#fff}.ml-menu-icon:after{content:'';width:20px;height:25px;border:2px solid #d4d4d4;position:absolute;right:6px;top:6px;background:#fff}.ml-menu-icon:hover{border-color:#72cc96}.ml-menu-icon:hover:before,.ml-menu-icon:hover:after{border-color:#72cc96}.webapp-menu-icon{position:absolute;top:30px;right:95px;width:20px;height:25px;border:2px solid #d4d4d4;background:#fff}.webapp-menu-icon:before{content:'';width:20px;height:25px;position:absolute;right:2px;border:2px solid #d4d4d4;top:2px;background:#fff}.webapp-menu-icon:after{content:'';width:20px;height:25px;border:2px solid #d4d4d4;position:absolute;right:6px;top:6px;background:#fff}.webapp-menu-icon:hover{border-color:#72cc96}.webapp-menu-icon:hover:before,.webapp-menu-icon:hover:after{border-color:#72cc96}#search-container{margin:auto;width:400px}#search-container input[type=text]{color:gray;outline:none;padding:15px 25px;margin:5px 1px 3px 0px;border:none;width:100%;border-radius:1px;box-shadow:0 1px 0px 0 rgba(0,0,0,0.16),0 0 0 1px rgba(0,0,0,0.08)}#search-container input[type=text]:hover{outline:none;border:none;margin:5px 1px 3px 0px;padding:15px 25px;-webkit-transition:all 0.30s ease-in-out;-moz-transition:all 0.30s ease-in-out;-ms-transition:all 0.30s ease-in-out;-o-transition:all 0.30s ease-in-out;box-shadow:0 2px 2px 0 rgba(0,0,0,0.16),0 0 0 1px rgba(0,0,0,0.08)}#search-container input[type=text]:focus{box-shadow:0 2px 2px 0 rgba(0,0,0,0.16),0 0 0 1px rgba(0,0,0,0.08);margin:5px 1px 3px 0px;padding:15px 25px;border:none;outline:none;-webkit-transition:all 0.30s ease-in-out;-moz-transition:all 0.30s ease-in-out;-ms-transition:all 0.30s ease-in-out;-o-transition:all 0.30s ease-in-out}@media screen and (max-width: 600px){#search-container input[type=text]{width:100%;box-sizing:border-box}}#search-container #results-container{color:#399f62;display:block;list-style-type:disc;margin-block-start:1em;margin-block-end:1em;margin-inline-start:0px;margin-inline-end:0px;padding-inline-start:40px}#search-container a{color:#399f62}.ml-link,.webapp-link,.posts-link,.projects-link{position:absolute;top:73px;font-size:12px;color:#999}.ml-link{right:145px}.webapp-link{right:85px}.posts-link{right:90px}.projects-link{right:20px}.overlay{position:fixed;background:#2c2d33;top:0;right:0;bottom:0;left:0;z-index:2;display:none;overflow-y:auto}.overlay.show{display:block}.projects-menu{font-size:0;height:100%}.projects-menu>li{display:inline-block;width:calc(100%/3);background:#2c2d33;height:50%;border:5px solid #2c2d33;position:relative;vertical-align:top;float:left;background-size:cover !important}.projects-menu>li:nth-child(8n+1),.projects-menu>li:nth-child(8n+2){width:50%;height:70%}.projects-menu>li:nth-child(8n+6){width:calc(100%/3 + 100%/3);height:100%}.projects-menu>li a{border:30px solid transparent;background:rgba(0,0,0,0.3);position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:background 0.2s linear;-moz-transition:background 0.2s linear;-ms-transition:background 0.2s linear;-o-transition:background 0.2s linear;transition:background 0.2s linear}.projects-menu>li a:hover:after,.projects-menu>li a:hover:before{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-transition:all 1s;-moz-transition:all 1s;-ms-transition:all 1s;-o-transition:all 1s;transition:all 1s}.projects-menu>li a span{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);-o-transform:translate(-50%, -50%);transform:translate(-50%, -50%);font-size:30px;color:#fff;padding-right:10px;white-space:nowrap;text-align:center}.projects-menu>li a span strong{color:rgba(255,255,255,0.7)}.projects-menu>li a span em{font-size:20px;line-height:33px;color:#999}.projects-menu>li a:after{content:"";position:absolute;top:0;border-top:1px solid rgba(255,255,255,0.3);border-bottom:1px solid rgba(255,255,255,0.3);display:block;height:100%;width:100%;-webkit-transform:scale(0, 1);-moz-transform:scale(0, 1);-ms-transform:scale(0, 1);-o-transform:scale(0, 1);transform:scale(0, 1);-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-ms-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s}.projects-menu>li a:before{content:"";border-right:1px solid rgba(255,255,255,0.3);border-left:1px solid rgba(255,255,255,0.3);display:block;height:100%;-webkit-transform:scale(1, 0);-moz-transform:scale(1, 0);-ms-transform:scale(1, 0);-o-transform:scale(1, 0);transform:scale(1, 0);-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-ms-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s}.logo{max-width:150px;display:inline-block;height:auto;background-size:100%;margin:0 auto;position:relative;font:0/0 verdana;color:transparent;text-shadow:none}.main-info,.about-info{text-align:center;max-width:400px;width:100%;margin:0 auto}.main-info h1,.main-info h2,.about-info h1,.about-info h2{font-size:30px;position:relative;margin-top:0}.main-info h1:after,.main-info h2:after,.about-info h1:after,.about-info h2:after{content:"";width:100px;height:2px;background:#585b63;bottom:-20px;position:absolute;left:50%;-webkit-transform:translatex(-50%);-moz-transform:translatex(-50%);-ms-transform:translatex(-50%);-o-transform:translatex(-50%);transform:translatex(-50%)}.main-info p,.about-info p{font-size:21px;line-height:30px;margin:10px 0;padding-top:25px}.main-info ul,.about-info ul{font-size:1em;margin-top:30px;overflow:hidden}.main-info ul li,.about-info ul li{display:inline-block;background:#585b63;margin-right:10px;vertical-align:middle;-webkit-transform:translateZ(0);transform:translateZ(0);box-shadow:0 0 1px transparent;-webkit-backface-visibility:hidden;backface-visibility:hidden;-moz-osx-font-smoothing:grayscale;position:relative;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:0.3s;transition-duration:0.3s}.main-info ul li:before,.about-info ul li:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;background:#72cc96;-webkit-transform:scaleY(0);transform:scaleY(0);-webkit-transform-origin:50% 100%;transform-origin:50% 100%;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:0.3s;transition-duration:0.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.main-info ul li:hover:before,.about-info ul li:hover:before{-webkit-transform:scaleY(1);transform:scaleY(1)}.main-info ul li:nth-child(odd),.about-info ul li:nth-child(odd){background:#2c2d33}.main-info ul li:last-child,.about-info ul li:last-child{margin-right:0}.main-info ul li a,.about-info ul li a{display:inline-block;font-size:1.3em;padding:0.3em 0.35em;color:#fff}.main-info{color:#fff}.main-info h1{font-weight:bold;text-transform:uppercase;letter-spacing:1px}.main-info h2{font-size:21px;line-height:30px;margin:10px 0;padding-top:25px}.main-info h2:after{display:none}.about-info{text-align:left}.about-info h1,.about-info h2{font-size:35px;color:#474747}.about-info h1:after,.about-info h2:after{position:absolute;left:auto;top:auto;-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none;background:#72cc96;left:0;width:200px}.about-info p{color:#999;font-size:16px;margin:10px 0;padding-top:0;line-height:24px}.about-info p:first-of-type{padding-top:35px}#posts .block-right{display:block}#posts .block-right .content{height:auto;display:block;max-width:800px}#posts .logo{top:20px;left:20px;position:absolute}#posts .logo img{width:50px;height:auto}#posts .logo:after{display:none}.section-title{font-size:100px;position:absolute;bottom:50px;left:50px;color:rgba(255,255,255,0.6);-ms-word-wrap:break-word;word-wrap:break-word}.section-title em{font-style:italic}.section-title span{font-size:20px}.posts-list{margin:50px 0}.posts-list>li{margin-bottom:23px;padding-bottom:20px;border-bottom:1px solid #eaeaea;list-style:none}.posts-list>li:last-child{border:none}.posts-list>li h2{font-size:30px;margin-bottom:15px}.posts-list>li p{color:#999}.posts-list>li .date{color:#399f62;float:right;display:inline-block;font-size:15px;padding-top:10px;text-transform:uppercase}.posts-list>li .post-title{display:inline-block;max-width:75%}.posts-list>li .post-title:hover span{border-bottom:1px dotted #72cc96}.posts-list .tags li>a{color:#474747}.tags{margin-top:20px}.tags>li{display:inline-block;background:#f2f2f2;padding:7px 10px;color:#474747;font-size:11px;text-transform:uppercase}.tags>li>a{color:#fff}.inner-post h1{font-size:70px;line-height:70px;margin-bottom:50px}.inner-post h2{font-size:30px;line-height:30px;margin-top:20px;margin-bottom:30px}.inner-post h1,.inner-post h2,.inner-post h3,.inner-post h4,.inner-post h5,.inner-post h6{font-weight:bold;color:rgba(44,45,51,0.7)}.inner-post p{font-size:18px;line-height:1.6;color:#6c6c6c;margin-bottom:1.3em}.inner-post small{color:#999;font-size:16px;margin-bottom:10px;display:block}.inner-post a:not(.btn):not(.pagination_pager){color:#399f62;border-bottom:1px dotted #72cc96}.inner-post ul,.inner-post ol{padding-left:30px}.inner-post ul>li,.inner-post ol>li{position:relative;margin-bottom:20px}.inner-post ul>li:first-child,.inner-post ol>li:first-child{margin-top:20px}.demo{margin-bottom:50px}.post-title-section{position:absolute;bottom:50px;left:50px;right:50px}.post-title-section .section-title{position:relative;left:auto;bottom:auto;font-size:80px}.post-title-section .tags>li{background:none;border:1px solid rgba(255,255,255,0.4);color:#fff;font-size:15px}.post-title-section .section-line{color:#72cc96;position:relative;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;align-items:center;font-size:25px;margin-bottom:20px}.post-title-section .section-line:after{content:'';-webkit-box-flex:1;-moz-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;height:3px;background:rgba(255,255,255,0.4);margin-left:10px}.post-title-section .section-line a{color:#72cc96}.post-title-section .section-line a:hover{color:#4dbe7a}.post-title-section .section-line em{display:inline-block;margin:0 10px}.post-title-section .section-line.reverse{margin-top:40px}.post-title-section .section-line.reverse:before{content:'';-webkit-box-flex:1;-moz-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;height:3px;background:rgba(255,255,255,0.4);margin-right:10px}.post-title-section .section-line.reverse:after{display:none}.date-highlight{text-align:center;margin:50px 0;color:#999;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;align-items:center}.date-highlight:before{content:'';-webkit-box-flex:1;-moz-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;height:2px;background:#eaeaea;margin-right:10px}.date-highlight:after{content:'';-webkit-box-flex:1;-moz-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;height:2px;background:#eaeaea;margin-left:10px}.footer-line{float:right;margin-bottom:50px}.share-buttons{position:absolute;top:32px;left:40px}.share-buttons>.btn{margin-bottom:0}@media screen and (max-height: 605px){.post-title-section .section-title{font-size:45px}}@media screen and (max-width: 960px){.block-left,.block-right{float:none;width:100%}html{overflow:auto}.block-right{overflow-y:inherit}.projects-menu li{width:50% !important;height:50% !important;float:left}.share-buttons span{display:none}}@media screen and (max-width: 640px){.posts-list{margin-top:80px}.posts-list>li .post-title{max-width:100%}.posts-list>li h2{font-size:20px}.posts-list>li .date{float:left;display:block;width:100%;padding-bottom:10px}.inner-post h2{font-size:20px;margin-bottom:20px}.inner-post p,.inner-post li{font-size:16px;line-height:24px}.inner-post ul>li{margin-bottom:10px}.date-highlight{margin:80px 0 40px}.post-title-section .section-line{display:none}.post-title-section .section-title{font-size:40px}.section-title{font-size:80px}.projects-menu li{width:100% !important;height:50% !important}.content{padding:20px}}.entry-meta{font-size:.75rem;text-transform:uppercase;padding-left:0;display:none}@media screen and (min-width: 750px){.entry-meta{display:block}}.entry-meta a{color:#737373}.entry-meta li{list-style-type:none;display:inline}.entry-meta .tag,.entry-meta .category{display:inline-block;background-color:#f7f7f7;border-radius:2px;text-decoration:none;transition:all 0.3s ease-in-out;margin:2px 5px;font-size:0.7rem;border:none !important}.entry-meta .tag span,.entry-meta .category span{float:left;padding:2px 6px}.entry-meta .tag .count,.entry-meta .category .count{background-color:#ebebeb}.entry-meta .tag:hover,.entry-meta .category:hover{background-color:#ebebeb}.entry-title>a{border:none !important}.pagination{display:inline-block;text-align:center;flex-direction:row;justify-content:space-between;width:100%;margin-top:1em}.pagination_pager{display:inline-block;padding:0.5em 0.75em;margin-bottom:0.5em;font-size:0.8em;font-weight:400;background-color:#f2f2f2;color:#a6a6a6 !important;text-align:center;white-space:nowrap;vertical-align:middle;cursor:pointer;transition:all 0.2s linear;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.pagination_pager:first-child{border-radius:4px 0 0 4px}.pagination_pager:last-child{border-radius:0 4px 4px 0}.pagination_pager:hover{background-color:#72cc96;color:#fff !important}.pagination_pager.disabled{background-color:#f7f7f7;color:#d9d9d9 !important}.pagination_pager.disabled:hover{background-color:#f7f7f7;color:#d9d9d9 !important}.pagination a{color:black;padding:8px 16px;text-decoration:none;border-radius:5px}.pagination a.active{background-color:#4CAF50;border-radius:5px;color:white}.pagination a:hover:not(.active){background-color:#ddd}.no_page{color:black;padding:8px 16px;text-decoration:none;border-radius:5px}.circle{border-radius:50%;width:100%;height:auto}.align-left{*zoom:1;float:left;margin-right:1.5em}.align-left:before,.align-left:after{display:table;content:"";line-height:0}.align-left:after{clear:both}.align-center{display:block;margin-left:auto;margin-right:auto}.align-right{*zoom:1;float:right;margin-left:1.5em}.align-right:before,.align-right:after{display:table;content:"";line-height:0}.align-right:after{clear:both}.btn{display:inline-block;padding:0.5em 0.75em;margin-bottom:0.5em;font-size:0.8em;font-weight:400;background-color:#ededed;color:#333;text-align:center;white-space:nowrap;vertical-align:middle;cursor:pointer;border:1px solid transparent;border-radius:2px;transition:all 0.3s ease-in-out;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.btn:hover{background-color:#64c1ed;border:1px solid #64c1ed;color:#f2f2f2}.btn_info{background-color:#b2e9ff}.btn_info:hover{background-color:#66d4ff;border-color:#66d4ff}.btn_warning{background-color:#faa937}.btn_warning:hover{background-color:#df8505;border-color:#df8505}.btn_success{background-color:#97dab2}.btn_success:hover{background-color:#5fc588;border-color:#5fc588}.btn_danger{background-color:#f38c89}.btn_danger:hover{background-color:#ec4844;border-color:#ec4844}.btn_facebook{background-color:#3b5998;color:#fff !important}.btn_facebook:hover{background-color:#6c83b2;border-color:#6c83b2}.btn_google-plus{background-color:#dc4e41;color:#fff !important}.btn_google-plus:hover{background-color:#e57a71;border-color:#e57a71}.btn_twitter{background-color:#55acee;color:#fff !important}.btn_twitter:hover{background-color:#80c1f2;border-color:#80c1f2}a.btn{text-decoration:none;color:#4d4d4d}.notice{margin:2em 0 !important;padding:1em;font-size:0.9em !important;text-indent:initial;background-color:#f7f7f7;border-radius:2px;box-shadow:0 1px 1px rgba(179,179,179,0.25)}.notice h4{margin-top:0 !important;margin-bottom:0.75em}.notice p:last-child{margin-bottom:0 !important}.notice h4+p{margin-top:0;padding-top:0}.notice a{color:#b3b3b3}.notice a:hover{color:#6b6b6b}.notice code{background-color:#fbfbfb}.notice ul:last-child{margin-bottom:0}.notice_info{margin:2em 0 !important;padding:1em;font-size:0.9em !important;text-indent:initial;background-color:#f2fbff;border-radius:2px;box-shadow:0 1px 1px rgba(127,219,255,0.25)}.notice_info h4{margin-top:0 !important;margin-bottom:0.75em}.notice_info p:last-child{margin-bottom:0 !important}.notice_info h4+p{margin-top:0;padding-top:0}.notice_info a{color:#7FDBFF}.notice_info a:hover{color:#4c8399}.notice_info code{background-color:#f9fdff}.notice_info ul:last-child{margin-bottom:0}.notice_warning{margin:2em 0 !important;padding:1em;font-size:0.9em !important;text-indent:initial;background-color:#fef4e6;border-radius:2px;box-shadow:0 1px 1px rgba(248,148,6,0.25)}.notice_warning h4{margin-top:0 !important;margin-bottom:0.75em}.notice_warning p:last-child{margin-bottom:0 !important}.notice_warning h4+p{margin-top:0;padding-top:0}.notice_warning a{color:#f89406}.notice_warning a:hover{color:#955904}.notice_warning code{background-color:#fffaf3}.notice_warning ul:last-child{margin-bottom:0}.notice_success{margin:2em 0 !important;padding:1em;font-size:0.9em !important;text-indent:initial;background-color:#f1faf5;border-radius:2px;box-shadow:0 1px 1px rgba(114,204,150,0.25)}.notice_success h4{margin-top:0 !important;margin-bottom:0.75em}.notice_success p:last-child{margin-bottom:0 !important}.notice_success h4+p{margin-top:0;padding-top:0}.notice_success a{color:#72cc96}.notice_success a:hover{color:#447a5a}.notice_success code{background-color:#f8fcfa}.notice_success ul:last-child{margin-bottom:0}.notice_danger{margin:2em 0 !important;padding:1em;font-size:0.9em !important;text-indent:initial;background-color:#fdefef;border-radius:2px;box-shadow:0 1px 1px rgba(238,95,91,0.25)}.notice_danger h4{margin-top:0 !important;margin-bottom:0.75em}.notice_danger p:last-child{margin-bottom:0 !important}.notice_danger h4+p{margin-top:0;padding-top:0}.notice_danger a{color:#ee5f5b}.notice_danger a:hover{color:#8f3937}.notice_danger code{background-color:#fef7f7}.notice_danger ul:last-child{margin-bottom:0}div.highlighter-rouge,figure.highlight{position:relative;display:block;margin-bottom:2em;background-color:#f5f5f5;color:#586e75;font-family:"LiberationMonoRegular",monospace;font-size:0.8em}pre.highlight{padding:1rem}.highlight pre{background-color:#f5f5f5}.highlight .c{color:#93a1a1}.highlight .err{color:#586e75}.highlight .g{color:#586e75}.highlight .k{color:#859900}.highlight .l{color:#586e75}.highlight .n{color:#586e75}.highlight .o{color:#859900}.highlight .x{color:#cb4b16}.highlight .p{color:#586e75}.highlight .cm{color:#93a1a1}.highlight .cp{color:#859900}.highlight .c1{color:#93a1a1}.highlight .cs{color:#859900}.highlight .gd{color:#2aa198}.highlight .ge{color:#586e75;font-style:italic}.highlight .gr{color:#dc322f}.highlight .gh{color:#cb4b16}.highlight .gi{color:#859900}.highlight .go{color:#586e75}.highlight .gp{color:#586e75}.highlight .gs{color:#586e75;font-weight:bold}.highlight .gu{color:#cb4b16}.highlight .gt{color:#586e75}.highlight .kc{color:#cb4b16}.highlight .kd{color:#268bd2}.highlight .kn{color:#859900}.highlight .kp{color:#859900}.highlight .kr{color:#268bd2}.highlight .kt{color:#dc322f}.highlight .ld{color:#586e75}.highlight .m{color:#2aa198}.highlight .s{color:#2aa198}.highlight .na{color:#586e75}.highlight .nb{color:#B58900}.highlight .nc{color:#268bd2}.highlight .no{color:#cb4b16}.highlight .nd{color:#268bd2}.highlight .ni{color:#cb4b16}.highlight .ne{color:#cb4b16}.highlight .nf{color:#268bd2}.highlight .nl{color:#586e75}.highlight .nn{color:#586e75}.highlight .nx{color:#586e75}.highlight .py{color:#586e75}.highlight .nt{color:#268bd2}.highlight .nv{color:#268bd2}.highlight .ow{color:#859900}.highlight .w{color:#586e75}.highlight .mf{color:#2aa198}.highlight .mh{color:#2aa198}.highlight .mi{color:#2aa198}.highlight .mo{color:#2aa198}.highlight .sb{color:#93a1a1}.highlight .sc{color:#2aa198}.highlight .sd{color:#586e75}.highlight .s2{color:#2aa198}.highlight .se{color:#cb4b16}.highlight .sh{color:#586e75}.highlight .si{color:#2aa198}.highlight .sx{color:#2aa198}.highlight .sr{color:#dc322f}.highlight .s1{color:#2aa198}.highlight .ss{color:#2aa198}.highlight .bp{color:#268bd2}.highlight .vc{color:#268bd2}.highlight .vg{color:#268bd2}.highlight .vi{color:#268bd2}.highlight .il{color:#2aa198}.gist .blob-code-inner,.gist .blob-num{font-family:"LiberationMonoRegular",monospace !important;font-size:0.8rem !important}.gist .gist-meta{font-family:"weblysleek_uilight",sans-serif !important}@font-face{font-family:'weblysleek_uilight';src:url("../fonts/weblysleekuil.eot");src:url("../fonts/weblysleekuil.eot?#iefix") format("embedded-opentype"),url("../fonts/weblysleekuil.woff2") format("woff2"),url("../fonts/weblysleekuil.woff") format("woff"),url("../fonts/weblysleekuil.ttf") format("truetype"),url("../fonts/weblysleekuil.svg#weblysleek_uilight") format("svg");font-weight:normal;font-style:normal}@font-face{font-family:'LiberationMonoRegular';src:url("../fonts/liberation-mono-webfont.eot");src:url("../fonts/liberation-mono-webfont.eot?#iefix") format("embedded-opentype"),url("../fonts/liberation-mono-webfont.woff") format("woff"),url("../fonts/liberation-mono-webfont.ttf") format("truetype"),url("../fonts/liberation-mono-webfont.svg#LiberationMonoRegular") format("svg");font-weight:normal;font-style:normal}/*! + * Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome + * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) + */@font-face{font-family:'FontAwesome';src:url("../fonts/fontawesome-webfont.eot?v=4.7.0");src:url("../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0") format("embedded-opentype"),url("../fonts/fontawesome-webfont.woff2?v=4.7.0") format("woff2"),url("../fonts/fontawesome-webfont.woff?v=4.7.0") format("woff"),url("../fonts/fontawesome-webfont.ttf?v=4.7.0") format("truetype"),url("../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular") format("svg");font-weight:normal;font-style:normal}.fa{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.3333333333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.2857142857em;text-align:center}.fa-ul{padding-left:0;margin-left:2.1428571429em;list-style-type:none}.fa-ul>li{position:relative}.fa-li{position:absolute;left:-2.1428571429em;width:2.1428571429em;top:.1428571429em;text-align:center}.fa-li.fa-lg{left:-1.8571428571em}.fa-border{padding:.2em .25em .15em;border:solid 0.08em #eee;border-radius:.1em}.fa-pull-left{float:left}.fa-pull-right{float:right}.fa.fa-pull-left{margin-right:.3em}.fa.fa-pull-right{margin-left:.3em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear}.fa-pulse{-webkit-animation:fa-spin 1s infinite steps(8);animation:fa-spin 1s infinite steps(8)}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fa-rotate-90{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";-webkit-transform:scale(-1, 1);-ms-transform:scale(-1, 1);transform:scale(-1, 1)}.fa-flip-vertical{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";-webkit-transform:scale(1, -1);-ms-transform:scale(1, -1);transform:scale(1, -1)}:root .fa-rotate-90,:root .fa-rotate-180,:root .fa-rotate-270,:root .fa-flip-horizontal,:root .fa-flip-vertical{filter:none}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-glass:before{content:""}.fa-music:before{content:""}.fa-search:before{content:""}.fa-envelope-o:before{content:""}.fa-heart:before{content:""}.fa-star:before{content:""}.fa-star-o:before{content:""}.fa-user:before{content:""}.fa-film:before{content:""}.fa-th-large:before{content:""}.fa-th:before{content:""}.fa-th-list:before{content:""}.fa-check:before{content:""}.fa-remove:before,.fa-close:before,.fa-times:before{content:""}.fa-search-plus:before{content:""}.fa-search-minus:before{content:""}.fa-power-off:before{content:""}.fa-signal:before{content:""}.fa-gear:before,.fa-cog:before{content:""}.fa-trash-o:before{content:""}.fa-home:before{content:""}.fa-file-o:before{content:""}.fa-clock-o:before{content:""}.fa-road:before{content:""}.fa-download:before{content:""}.fa-arrow-circle-o-down:before{content:""}.fa-arrow-circle-o-up:before{content:""}.fa-inbox:before{content:""}.fa-play-circle-o:before{content:""}.fa-rotate-right:before,.fa-repeat:before{content:""}.fa-refresh:before{content:""}.fa-list-alt:before{content:""}.fa-lock:before{content:""}.fa-flag:before{content:""}.fa-headphones:before{content:""}.fa-volume-off:before{content:""}.fa-volume-down:before{content:""}.fa-volume-up:before{content:""}.fa-qrcode:before{content:""}.fa-barcode:before{content:""}.fa-tag:before{content:""}.fa-tags:before{content:""}.fa-book:before{content:""}.fa-bookmark:before{content:""}.fa-print:before{content:""}.fa-camera:before{content:""}.fa-font:before{content:""}.fa-bold:before{content:""}.fa-italic:before{content:""}.fa-text-height:before{content:""}.fa-text-width:before{content:""}.fa-align-left:before{content:""}.fa-align-center:before{content:""}.fa-align-right:before{content:""}.fa-align-justify:before{content:""}.fa-list:before{content:""}.fa-dedent:before,.fa-outdent:before{content:""}.fa-indent:before{content:""}.fa-video-camera:before{content:""}.fa-photo:before,.fa-image:before,.fa-picture-o:before{content:""}.fa-pencil:before{content:""}.fa-map-marker:before{content:""}.fa-adjust:before{content:""}.fa-tint:before{content:""}.fa-edit:before,.fa-pencil-square-o:before{content:""}.fa-share-square-o:before{content:""}.fa-check-square-o:before{content:""}.fa-arrows:before{content:""}.fa-step-backward:before{content:""}.fa-fast-backward:before{content:""}.fa-backward:before{content:""}.fa-play:before{content:""}.fa-pause:before{content:""}.fa-stop:before{content:""}.fa-forward:before{content:""}.fa-fast-forward:before{content:""}.fa-step-forward:before{content:""}.fa-eject:before{content:""}.fa-chevron-left:before{content:""}.fa-chevron-right:before{content:""}.fa-plus-circle:before{content:""}.fa-minus-circle:before{content:""}.fa-times-circle:before{content:""}.fa-check-circle:before{content:""}.fa-question-circle:before{content:""}.fa-info-circle:before{content:""}.fa-crosshairs:before{content:""}.fa-times-circle-o:before{content:""}.fa-check-circle-o:before{content:""}.fa-ban:before{content:""}.fa-arrow-left:before{content:""}.fa-arrow-right:before{content:""}.fa-arrow-up:before{content:""}.fa-arrow-down:before{content:""}.fa-mail-forward:before,.fa-share:before{content:""}.fa-expand:before{content:""}.fa-compress:before{content:""}.fa-plus:before{content:""}.fa-minus:before{content:""}.fa-asterisk:before{content:""}.fa-exclamation-circle:before{content:""}.fa-gift:before{content:""}.fa-leaf:before{content:""}.fa-fire:before{content:""}.fa-eye:before{content:""}.fa-eye-slash:before{content:""}.fa-warning:before,.fa-exclamation-triangle:before{content:""}.fa-plane:before{content:""}.fa-calendar:before{content:""}.fa-random:before{content:""}.fa-comment:before{content:""}.fa-magnet:before{content:""}.fa-chevron-up:before{content:""}.fa-chevron-down:before{content:""}.fa-retweet:before{content:""}.fa-shopping-cart:before{content:""}.fa-folder:before{content:""}.fa-folder-open:before{content:""}.fa-arrows-v:before{content:""}.fa-arrows-h:before{content:""}.fa-bar-chart-o:before,.fa-bar-chart:before{content:""}.fa-twitter-square:before{content:""}.fa-facebook-square:before{content:""}.fa-camera-retro:before{content:""}.fa-key:before{content:""}.fa-gears:before,.fa-cogs:before{content:""}.fa-comments:before{content:""}.fa-thumbs-o-up:before{content:""}.fa-thumbs-o-down:before{content:""}.fa-star-half:before{content:""}.fa-heart-o:before{content:""}.fa-sign-out:before{content:""}.fa-linkedin-square:before{content:""}.fa-thumb-tack:before{content:""}.fa-external-link:before{content:""}.fa-sign-in:before{content:""}.fa-trophy:before{content:""}.fa-github-square:before{content:""}.fa-upload:before{content:""}.fa-lemon-o:before{content:""}.fa-phone:before{content:""}.fa-square-o:before{content:""}.fa-bookmark-o:before{content:""}.fa-phone-square:before{content:""}.fa-twitter:before{content:""}.fa-facebook-f:before,.fa-facebook:before{content:""}.fa-github:before{content:""}.fa-unlock:before{content:""}.fa-credit-card:before{content:""}.fa-feed:before,.fa-rss:before{content:""}.fa-hdd-o:before{content:""}.fa-bullhorn:before{content:""}.fa-bell:before{content:""}.fa-certificate:before{content:""}.fa-hand-o-right:before{content:""}.fa-hand-o-left:before{content:""}.fa-hand-o-up:before{content:""}.fa-hand-o-down:before{content:""}.fa-arrow-circle-left:before{content:""}.fa-arrow-circle-right:before{content:""}.fa-arrow-circle-up:before{content:""}.fa-arrow-circle-down:before{content:""}.fa-globe:before{content:""}.fa-wrench:before{content:""}.fa-tasks:before{content:""}.fa-filter:before{content:""}.fa-briefcase:before{content:""}.fa-arrows-alt:before{content:""}.fa-group:before,.fa-users:before{content:""}.fa-chain:before,.fa-link:before{content:""}.fa-cloud:before{content:""}.fa-flask:before{content:""}.fa-cut:before,.fa-scissors:before{content:""}.fa-copy:before,.fa-files-o:before{content:""}.fa-paperclip:before{content:""}.fa-save:before,.fa-floppy-o:before{content:""}.fa-square:before{content:""}.fa-navicon:before,.fa-reorder:before,.fa-bars:before{content:""}.fa-list-ul:before{content:""}.fa-list-ol:before{content:""}.fa-strikethrough:before{content:""}.fa-underline:before{content:""}.fa-table:before{content:""}.fa-magic:before{content:""}.fa-truck:before{content:""}.fa-pinterest:before{content:""}.fa-pinterest-square:before{content:""}.fa-google-plus-square:before{content:""}.fa-google-plus:before{content:""}.fa-money:before{content:""}.fa-caret-down:before{content:""}.fa-caret-up:before{content:""}.fa-caret-left:before{content:""}.fa-caret-right:before{content:""}.fa-columns:before{content:""}.fa-unsorted:before,.fa-sort:before{content:""}.fa-sort-down:before,.fa-sort-desc:before{content:""}.fa-sort-up:before,.fa-sort-asc:before{content:""}.fa-envelope:before{content:""}.fa-linkedin:before{content:""}.fa-rotate-left:before,.fa-undo:before{content:""}.fa-legal:before,.fa-gavel:before{content:""}.fa-dashboard:before,.fa-tachometer:before{content:""}.fa-comment-o:before{content:""}.fa-comments-o:before{content:""}.fa-flash:before,.fa-bolt:before{content:""}.fa-sitemap:before{content:""}.fa-umbrella:before{content:""}.fa-paste:before,.fa-clipboard:before{content:""}.fa-lightbulb-o:before{content:""}.fa-exchange:before{content:""}.fa-cloud-download:before{content:""}.fa-cloud-upload:before{content:""}.fa-user-md:before{content:""}.fa-stethoscope:before{content:""}.fa-suitcase:before{content:""}.fa-bell-o:before{content:""}.fa-coffee:before{content:""}.fa-cutlery:before{content:""}.fa-file-text-o:before{content:""}.fa-building-o:before{content:""}.fa-hospital-o:before{content:""}.fa-ambulance:before{content:""}.fa-medkit:before{content:""}.fa-fighter-jet:before{content:""}.fa-beer:before{content:""}.fa-h-square:before{content:""}.fa-plus-square:before{content:""}.fa-angle-double-left:before{content:""}.fa-angle-double-right:before{content:""}.fa-angle-double-up:before{content:""}.fa-angle-double-down:before{content:""}.fa-angle-left:before{content:""}.fa-angle-right:before{content:""}.fa-angle-up:before{content:""}.fa-angle-down:before{content:""}.fa-desktop:before{content:""}.fa-laptop:before{content:""}.fa-tablet:before{content:""}.fa-mobile-phone:before,.fa-mobile:before{content:""}.fa-circle-o:before{content:""}.fa-quote-left:before{content:""}.fa-quote-right:before{content:""}.fa-spinner:before{content:""}.fa-circle:before{content:""}.fa-mail-reply:before,.fa-reply:before{content:""}.fa-github-alt:before{content:""}.fa-folder-o:before{content:""}.fa-folder-open-o:before{content:""}.fa-smile-o:before{content:""}.fa-frown-o:before{content:""}.fa-meh-o:before{content:""}.fa-gamepad:before{content:""}.fa-keyboard-o:before{content:""}.fa-flag-o:before{content:""}.fa-flag-checkered:before{content:""}.fa-terminal:before{content:""}.fa-code:before{content:""}.fa-mail-reply-all:before,.fa-reply-all:before{content:""}.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:""}.fa-location-arrow:before{content:""}.fa-crop:before{content:""}.fa-code-fork:before{content:""}.fa-unlink:before,.fa-chain-broken:before{content:""}.fa-question:before{content:""}.fa-info:before{content:""}.fa-exclamation:before{content:""}.fa-superscript:before{content:""}.fa-subscript:before{content:""}.fa-eraser:before{content:""}.fa-puzzle-piece:before{content:""}.fa-microphone:before{content:""}.fa-microphone-slash:before{content:""}.fa-shield:before{content:""}.fa-calendar-o:before{content:""}.fa-fire-extinguisher:before{content:""}.fa-rocket:before{content:""}.fa-maxcdn:before{content:""}.fa-chevron-circle-left:before{content:""}.fa-chevron-circle-right:before{content:""}.fa-chevron-circle-up:before{content:""}.fa-chevron-circle-down:before{content:""}.fa-html5:before{content:""}.fa-css3:before{content:""}.fa-anchor:before{content:""}.fa-unlock-alt:before{content:""}.fa-bullseye:before{content:""}.fa-ellipsis-h:before{content:""}.fa-ellipsis-v:before{content:""}.fa-rss-square:before{content:""}.fa-play-circle:before{content:""}.fa-ticket:before{content:""}.fa-minus-square:before{content:""}.fa-minus-square-o:before{content:""}.fa-level-up:before{content:""}.fa-level-down:before{content:""}.fa-check-square:before{content:""}.fa-pencil-square:before{content:""}.fa-external-link-square:before{content:""}.fa-share-square:before{content:""}.fa-compass:before{content:""}.fa-toggle-down:before,.fa-caret-square-o-down:before{content:""}.fa-toggle-up:before,.fa-caret-square-o-up:before{content:""}.fa-toggle-right:before,.fa-caret-square-o-right:before{content:""}.fa-euro:before,.fa-eur:before{content:""}.fa-gbp:before{content:""}.fa-dollar:before,.fa-usd:before{content:""}.fa-rupee:before,.fa-inr:before{content:""}.fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:""}.fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:""}.fa-won:before,.fa-krw:before{content:""}.fa-bitcoin:before,.fa-btc:before{content:""}.fa-file:before{content:""}.fa-file-text:before{content:""}.fa-sort-alpha-asc:before{content:""}.fa-sort-alpha-desc:before{content:""}.fa-sort-amount-asc:before{content:""}.fa-sort-amount-desc:before{content:""}.fa-sort-numeric-asc:before{content:""}.fa-sort-numeric-desc:before{content:""}.fa-thumbs-up:before{content:""}.fa-thumbs-down:before{content:""}.fa-youtube-square:before{content:""}.fa-youtube:before{content:""}.fa-xing:before{content:""}.fa-xing-square:before{content:""}.fa-youtube-play:before{content:""}.fa-dropbox:before{content:""}.fa-stack-overflow:before{content:""}.fa-instagram:before{content:""}.fa-flickr:before{content:""}.fa-adn:before{content:""}.fa-bitbucket:before{content:""}.fa-bitbucket-square:before{content:""}.fa-tumblr:before{content:""}.fa-tumblr-square:before{content:""}.fa-long-arrow-down:before{content:""}.fa-long-arrow-up:before{content:""}.fa-long-arrow-left:before{content:""}.fa-long-arrow-right:before{content:""}.fa-apple:before{content:""}.fa-windows:before{content:""}.fa-android:before{content:""}.fa-linux:before{content:""}.fa-dribbble:before{content:""}.fa-skype:before{content:""}.fa-foursquare:before{content:""}.fa-trello:before{content:""}.fa-female:before{content:""}.fa-male:before{content:""}.fa-gittip:before,.fa-gratipay:before{content:""}.fa-sun-o:before{content:""}.fa-moon-o:before{content:""}.fa-archive:before{content:""}.fa-bug:before{content:""}.fa-vk:before{content:""}.fa-weibo:before{content:""}.fa-renren:before{content:""}.fa-pagelines:before{content:""}.fa-stack-exchange:before{content:""}.fa-arrow-circle-o-right:before{content:""}.fa-arrow-circle-o-left:before{content:""}.fa-toggle-left:before,.fa-caret-square-o-left:before{content:""}.fa-dot-circle-o:before{content:""}.fa-wheelchair:before{content:""}.fa-vimeo-square:before{content:""}.fa-turkish-lira:before,.fa-try:before{content:""}.fa-plus-square-o:before{content:""}.fa-space-shuttle:before{content:""}.fa-slack:before{content:""}.fa-envelope-square:before{content:""}.fa-wordpress:before{content:""}.fa-openid:before{content:""}.fa-institution:before,.fa-bank:before,.fa-university:before{content:""}.fa-mortar-board:before,.fa-graduation-cap:before{content:""}.fa-yahoo:before{content:""}.fa-google:before{content:""}.fa-reddit:before{content:""}.fa-reddit-square:before{content:""}.fa-stumbleupon-circle:before{content:""}.fa-stumbleupon:before{content:""}.fa-delicious:before{content:""}.fa-digg:before{content:""}.fa-pied-piper-pp:before{content:""}.fa-pied-piper-alt:before{content:""}.fa-drupal:before{content:""}.fa-joomla:before{content:""}.fa-language:before{content:""}.fa-fax:before{content:""}.fa-building:before{content:""}.fa-child:before{content:""}.fa-paw:before{content:""}.fa-spoon:before{content:""}.fa-cube:before{content:""}.fa-cubes:before{content:""}.fa-behance:before{content:""}.fa-behance-square:before{content:""}.fa-steam:before{content:""}.fa-steam-square:before{content:""}.fa-recycle:before{content:""}.fa-automobile:before,.fa-car:before{content:""}.fa-cab:before,.fa-taxi:before{content:""}.fa-tree:before{content:""}.fa-spotify:before{content:""}.fa-deviantart:before{content:""}.fa-soundcloud:before{content:""}.fa-database:before{content:""}.fa-file-pdf-o:before{content:""}.fa-file-word-o:before{content:""}.fa-file-excel-o:before{content:""}.fa-file-powerpoint-o:before{content:""}.fa-file-photo-o:before,.fa-file-picture-o:before,.fa-file-image-o:before{content:""}.fa-file-zip-o:before,.fa-file-archive-o:before{content:""}.fa-file-sound-o:before,.fa-file-audio-o:before{content:""}.fa-file-movie-o:before,.fa-file-video-o:before{content:""}.fa-file-code-o:before{content:""}.fa-vine:before{content:""}.fa-codepen:before{content:""}.fa-jsfiddle:before{content:""}.fa-life-bouy:before,.fa-life-buoy:before,.fa-life-saver:before,.fa-support:before,.fa-life-ring:before{content:""}.fa-circle-o-notch:before{content:""}.fa-ra:before,.fa-resistance:before,.fa-rebel:before{content:""}.fa-ge:before,.fa-empire:before{content:""}.fa-git-square:before{content:""}.fa-git:before{content:""}.fa-y-combinator-square:before,.fa-yc-square:before,.fa-hacker-news:before{content:""}.fa-tencent-weibo:before{content:""}.fa-qq:before{content:""}.fa-wechat:before,.fa-weixin:before{content:""}.fa-send:before,.fa-paper-plane:before{content:""}.fa-send-o:before,.fa-paper-plane-o:before{content:""}.fa-history:before{content:""}.fa-circle-thin:before{content:""}.fa-header:before{content:""}.fa-paragraph:before{content:""}.fa-sliders:before{content:""}.fa-share-alt:before{content:""}.fa-share-alt-square:before{content:""}.fa-bomb:before{content:""}.fa-soccer-ball-o:before,.fa-futbol-o:before{content:""}.fa-tty:before{content:""}.fa-binoculars:before{content:""}.fa-plug:before{content:""}.fa-slideshare:before{content:""}.fa-twitch:before{content:""}.fa-yelp:before{content:""}.fa-newspaper-o:before{content:""}.fa-wifi:before{content:""}.fa-calculator:before{content:""}.fa-paypal:before{content:""}.fa-google-wallet:before{content:""}.fa-cc-visa:before{content:""}.fa-cc-mastercard:before{content:""}.fa-cc-discover:before{content:""}.fa-cc-amex:before{content:""}.fa-cc-paypal:before{content:""}.fa-cc-stripe:before{content:""}.fa-bell-slash:before{content:""}.fa-bell-slash-o:before{content:""}.fa-trash:before{content:""}.fa-copyright:before{content:""}.fa-at:before{content:""}.fa-eyedropper:before{content:""}.fa-paint-brush:before{content:""}.fa-birthday-cake:before{content:""}.fa-area-chart:before{content:""}.fa-pie-chart:before{content:""}.fa-line-chart:before{content:""}.fa-lastfm:before{content:""}.fa-lastfm-square:before{content:""}.fa-toggle-off:before{content:""}.fa-toggle-on:before{content:""}.fa-bicycle:before{content:""}.fa-bus:before{content:""}.fa-ioxhost:before{content:""}.fa-angellist:before{content:""}.fa-cc:before{content:""}.fa-shekel:before,.fa-sheqel:before,.fa-ils:before{content:""}.fa-meanpath:before{content:""}.fa-buysellads:before{content:""}.fa-connectdevelop:before{content:""}.fa-dashcube:before{content:""}.fa-forumbee:before{content:""}.fa-leanpub:before{content:""}.fa-sellsy:before{content:""}.fa-shirtsinbulk:before{content:""}.fa-simplybuilt:before{content:""}.fa-skyatlas:before{content:""}.fa-cart-plus:before{content:""}.fa-cart-arrow-down:before{content:""}.fa-diamond:before{content:""}.fa-ship:before{content:""}.fa-user-secret:before{content:""}.fa-motorcycle:before{content:""}.fa-street-view:before{content:""}.fa-heartbeat:before{content:""}.fa-venus:before{content:""}.fa-mars:before{content:""}.fa-mercury:before{content:""}.fa-intersex:before,.fa-transgender:before{content:""}.fa-transgender-alt:before{content:""}.fa-venus-double:before{content:""}.fa-mars-double:before{content:""}.fa-venus-mars:before{content:""}.fa-mars-stroke:before{content:""}.fa-mars-stroke-v:before{content:""}.fa-mars-stroke-h:before{content:""}.fa-neuter:before{content:""}.fa-genderless:before{content:""}.fa-facebook-official:before{content:""}.fa-pinterest-p:before{content:""}.fa-whatsapp:before{content:""}.fa-server:before{content:""}.fa-user-plus:before{content:""}.fa-user-times:before{content:""}.fa-hotel:before,.fa-bed:before{content:""}.fa-viacoin:before{content:""}.fa-train:before{content:""}.fa-subway:before{content:""}.fa-medium:before{content:""}.fa-yc:before,.fa-y-combinator:before{content:""}.fa-optin-monster:before{content:""}.fa-opencart:before{content:""}.fa-expeditedssl:before{content:""}.fa-battery-4:before,.fa-battery:before,.fa-battery-full:before{content:""}.fa-battery-3:before,.fa-battery-three-quarters:before{content:""}.fa-battery-2:before,.fa-battery-half:before{content:""}.fa-battery-1:before,.fa-battery-quarter:before{content:""}.fa-battery-0:before,.fa-battery-empty:before{content:""}.fa-mouse-pointer:before{content:""}.fa-i-cursor:before{content:""}.fa-object-group:before{content:""}.fa-object-ungroup:before{content:""}.fa-sticky-note:before{content:""}.fa-sticky-note-o:before{content:""}.fa-cc-jcb:before{content:""}.fa-cc-diners-club:before{content:""}.fa-clone:before{content:""}.fa-balance-scale:before{content:""}.fa-hourglass-o:before{content:""}.fa-hourglass-1:before,.fa-hourglass-start:before{content:""}.fa-hourglass-2:before,.fa-hourglass-half:before{content:""}.fa-hourglass-3:before,.fa-hourglass-end:before{content:""}.fa-hourglass:before{content:""}.fa-hand-grab-o:before,.fa-hand-rock-o:before{content:""}.fa-hand-stop-o:before,.fa-hand-paper-o:before{content:""}.fa-hand-scissors-o:before{content:""}.fa-hand-lizard-o:before{content:""}.fa-hand-spock-o:before{content:""}.fa-hand-pointer-o:before{content:""}.fa-hand-peace-o:before{content:""}.fa-trademark:before{content:""}.fa-registered:before{content:""}.fa-creative-commons:before{content:""}.fa-gg:before{content:""}.fa-gg-circle:before{content:""}.fa-tripadvisor:before{content:""}.fa-odnoklassniki:before{content:""}.fa-odnoklassniki-square:before{content:""}.fa-get-pocket:before{content:""}.fa-wikipedia-w:before{content:""}.fa-safari:before{content:""}.fa-chrome:before{content:""}.fa-firefox:before{content:""}.fa-opera:before{content:""}.fa-internet-explorer:before{content:""}.fa-tv:before,.fa-television:before{content:""}.fa-contao:before{content:""}.fa-500px:before{content:""}.fa-amazon:before{content:""}.fa-calendar-plus-o:before{content:""}.fa-calendar-minus-o:before{content:""}.fa-calendar-times-o:before{content:""}.fa-calendar-check-o:before{content:""}.fa-industry:before{content:""}.fa-map-pin:before{content:""}.fa-map-signs:before{content:""}.fa-map-o:before{content:""}.fa-map:before{content:""}.fa-commenting:before{content:""}.fa-commenting-o:before{content:""}.fa-houzz:before{content:""}.fa-vimeo:before{content:""}.fa-black-tie:before{content:""}.fa-fonticons:before{content:""}.fa-reddit-alien:before{content:""}.fa-edge:before{content:""}.fa-credit-card-alt:before{content:""}.fa-codiepie:before{content:""}.fa-modx:before{content:""}.fa-fort-awesome:before{content:""}.fa-usb:before{content:""}.fa-product-hunt:before{content:""}.fa-mixcloud:before{content:""}.fa-scribd:before{content:""}.fa-pause-circle:before{content:""}.fa-pause-circle-o:before{content:""}.fa-stop-circle:before{content:""}.fa-stop-circle-o:before{content:""}.fa-shopping-bag:before{content:""}.fa-shopping-basket:before{content:""}.fa-hashtag:before{content:""}.fa-bluetooth:before{content:""}.fa-bluetooth-b:before{content:""}.fa-percent:before{content:""}.fa-gitlab:before{content:""}.fa-wpbeginner:before{content:""}.fa-wpforms:before{content:""}.fa-envira:before{content:""}.fa-universal-access:before{content:""}.fa-wheelchair-alt:before{content:""}.fa-question-circle-o:before{content:""}.fa-blind:before{content:""}.fa-audio-description:before{content:""}.fa-volume-control-phone:before{content:""}.fa-braille:before{content:""}.fa-assistive-listening-systems:before{content:""}.fa-asl-interpreting:before,.fa-american-sign-language-interpreting:before{content:""}.fa-deafness:before,.fa-hard-of-hearing:before,.fa-deaf:before{content:""}.fa-glide:before{content:""}.fa-glide-g:before{content:""}.fa-signing:before,.fa-sign-language:before{content:""}.fa-low-vision:before{content:""}.fa-viadeo:before{content:""}.fa-viadeo-square:before{content:""}.fa-snapchat:before{content:""}.fa-snapchat-ghost:before{content:""}.fa-snapchat-square:before{content:""}.fa-pied-piper:before{content:""}.fa-first-order:before{content:""}.fa-yoast:before{content:""}.fa-themeisle:before{content:""}.fa-google-plus-circle:before,.fa-google-plus-official:before{content:""}.fa-fa:before,.fa-font-awesome:before{content:""}.fa-handshake-o:before{content:""}.fa-envelope-open:before{content:""}.fa-envelope-open-o:before{content:""}.fa-linode:before{content:""}.fa-address-book:before{content:""}.fa-address-book-o:before{content:""}.fa-vcard:before,.fa-address-card:before{content:""}.fa-vcard-o:before,.fa-address-card-o:before{content:""}.fa-user-circle:before{content:""}.fa-user-circle-o:before{content:""}.fa-user-o:before{content:""}.fa-id-badge:before{content:""}.fa-drivers-license:before,.fa-id-card:before{content:""}.fa-drivers-license-o:before,.fa-id-card-o:before{content:""}.fa-quora:before{content:""}.fa-free-code-camp:before{content:""}.fa-telegram:before{content:""}.fa-thermometer-4:before,.fa-thermometer:before,.fa-thermometer-full:before{content:""}.fa-thermometer-3:before,.fa-thermometer-three-quarters:before{content:""}.fa-thermometer-2:before,.fa-thermometer-half:before{content:""}.fa-thermometer-1:before,.fa-thermometer-quarter:before{content:""}.fa-thermometer-0:before,.fa-thermometer-empty:before{content:""}.fa-shower:before{content:""}.fa-bathtub:before,.fa-s15:before,.fa-bath:before{content:""}.fa-podcast:before{content:""}.fa-window-maximize:before{content:""}.fa-window-minimize:before{content:""}.fa-window-restore:before{content:""}.fa-times-rectangle:before,.fa-window-close:before{content:""}.fa-times-rectangle-o:before,.fa-window-close-o:before{content:""}.fa-bandcamp:before{content:""}.fa-grav:before{content:""}.fa-etsy:before{content:""}.fa-imdb:before{content:""}.fa-ravelry:before{content:""}.fa-eercast:before{content:""}.fa-microchip:before{content:""}.fa-snowflake-o:before{content:""}.fa-superpowers:before{content:""}.fa-wpexplorer:before{content:""}.fa-meetup:before{content:""}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.sr-only-focusable:active,.sr-only-focusable:focus{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}.mfp-counter{font-family:"weblysleek_uilight",sans-serif}.mfp-bg{top:0;left:0;width:100%;height:100%;z-index:1042;overflow:hidden;position:fixed;background:#000;opacity:.8}.mfp-wrap{top:0;left:0;width:100%;height:100%;z-index:1043;position:fixed;outline:none !important;-webkit-backface-visibility:hidden}.mfp-container{text-align:center;position:absolute;width:100%;height:100%;left:0;top:0;padding:0 8px;box-sizing:border-box}.mfp-container:before{content:'';display:inline-block;height:100%;vertical-align:middle}.mfp-align-top .mfp-container:before{display:none}.mfp-content{position:relative;display:inline-block;vertical-align:middle;margin:0 auto;text-align:left;z-index:1045}.mfp-inline-holder .mfp-content,.mfp-ajax-holder .mfp-content{width:100%;cursor:auto}.mfp-ajax-cur{cursor:progress}.mfp-zoom-out-cur,.mfp-zoom-out-cur .mfp-image-holder .mfp-close{cursor:-moz-zoom-out;cursor:-webkit-zoom-out;cursor:zoom-out}.mfp-zoom{cursor:pointer;cursor:-webkit-zoom-in;cursor:-moz-zoom-in;cursor:zoom-in}.mfp-auto-cursor .mfp-content{cursor:auto}.mfp-close,.mfp-arrow,.mfp-preloader,.mfp-counter{-webkit-user-select:none;-moz-user-select:none;user-select:none}.mfp-loading.mfp-figure{display:none}.mfp-hide{display:none !important}.mfp-preloader{color:#d4d4d4;position:absolute;top:50%;width:auto;text-align:center;margin-top:-0.8em;left:8px;right:8px;z-index:1044}.mfp-preloader a{color:#d4d4d4}.mfp-preloader a:hover{color:#fff}.mfp-s-ready .mfp-preloader{display:none}.mfp-s-error .mfp-content{display:none}button.mfp-close,button.mfp-arrow{overflow:visible;cursor:pointer;background:transparent;border:0;-webkit-appearance:none;display:block;outline:none;padding:0;z-index:1046;box-shadow:none;touch-action:manipulation}button::-moz-focus-inner{padding:0;border:0}.mfp-close{width:44px;height:44px;line-height:44px;position:absolute;right:0;top:0;text-decoration:none;text-align:center;opacity:1;padding:0 0 18px 10px;color:#fff;font-style:normal;font-size:28px;font-family:Arial, Baskerville, monospace}.mfp-close:hover,.mfp-close:focus{opacity:1}.mfp-close:active{top:1px}.mfp-close-btn-in .mfp-close{color:#fff}.mfp-image-holder .mfp-close,.mfp-iframe-holder .mfp-close{color:#fff;right:-6px;text-align:right;padding-right:6px;width:100%}.mfp-counter{position:absolute;top:0;right:0;color:#d4d4d4;font-size:12px;line-height:18px;white-space:nowrap}.mfp-arrow{position:absolute;opacity:1;margin:0;top:50%;margin-top:-55px;padding:0;width:90px;height:110px;-webkit-tap-highlight-color:transparent}.mfp-arrow:active{margin-top:-54px}.mfp-arrow:hover,.mfp-arrow:focus{opacity:1}.mfp-arrow:before,.mfp-arrow:after{content:'';display:block;width:0;height:0;position:absolute;left:0;top:0;margin-top:35px;margin-left:35px;border:medium inset transparent}.mfp-arrow:after{border-top-width:13px;border-bottom-width:13px;top:8px}.mfp-arrow:before{border-top-width:21px;border-bottom-width:21px;opacity:0.7}.mfp-arrow-left{left:0}.mfp-arrow-left:after{border-right:17px solid #fff;margin-left:31px}.mfp-arrow-left:before{margin-left:25px;border-right:27px solid #fff}.mfp-arrow-right{right:0}.mfp-arrow-right:after{border-left:17px solid #fff;margin-left:39px}.mfp-arrow-right:before{border-left:27px solid #fff}.mfp-iframe-holder{padding-top:40px;padding-bottom:40px}.mfp-iframe-holder .mfp-content{line-height:0;width:100%;max-width:900px}.mfp-iframe-holder .mfp-close{top:-40px}.mfp-iframe-scaler{width:100%;height:0;overflow:hidden;padding-top:56.25%}.mfp-iframe-scaler iframe{position:absolute;display:block;top:0;left:0;width:100%;height:100%;box-shadow:0 0 8px rgba(0,0,0,0.6);background:#000}img.mfp-img{width:auto;max-width:100%;height:auto;display:block;line-height:0;box-sizing:border-box;padding:40px 0 40px;margin:0 auto}.mfp-figure{line-height:0}.mfp-figure:after{content:'';position:absolute;left:0;top:40px;bottom:40px;display:block;right:0;width:auto;height:auto;z-index:-1;box-shadow:0 0 8px rgba(0,0,0,0.6);background:#444}.mfp-figure small{color:#BDBDBD;display:block;font-size:12px;line-height:14px}.mfp-figure figure{margin:0}.mfp-bottom-bar{margin-top:-36px;position:absolute;top:100%;left:0;width:100%;cursor:auto}.mfp-title{text-align:left;line-height:18px;color:#F3F3F3;word-wrap:break-word;padding-right:36px}.mfp-image-holder .mfp-content{max-width:100%}.mfp-gallery .mfp-image-holder .mfp-figure{cursor:pointer}@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px){.mfp-img-mobile .mfp-image-holder{padding-left:0;padding-right:0}.mfp-img-mobile img.mfp-img{padding:0}.mfp-img-mobile .mfp-figure:after{top:0;bottom:0}.mfp-img-mobile .mfp-figure small{display:inline;margin-left:5px}.mfp-img-mobile .mfp-bottom-bar{background:rgba(0,0,0,0.6);bottom:0;margin:0;top:auto;padding:3px 5px;position:fixed;box-sizing:border-box}.mfp-img-mobile .mfp-bottom-bar:empty{padding:0}.mfp-img-mobile .mfp-counter{right:5px;top:3px}.mfp-img-mobile .mfp-close{top:0;right:0;width:35px;height:35px;line-height:35px;background:rgba(0,0,0,0.6);position:fixed;text-align:center;padding:0}}@media all and (max-width: 900px){.mfp-arrow{-webkit-transform:scale(0.75);transform:scale(0.75)}.mfp-arrow-left{-webkit-transform-origin:0;transform-origin:0}.mfp-arrow-right{-webkit-transform-origin:100%;transform-origin:100%}.mfp-container{padding-left:6px;padding-right:6px}} diff --git a/_site/assets/fonts/fontawesome-webfont.eot b/_site/assets/fonts/fontawesome-webfont.eot new file mode 100644 index 000000000..e9f60ca95 Binary files /dev/null and b/_site/assets/fonts/fontawesome-webfont.eot differ diff --git a/_site/assets/fonts/fontawesome-webfont.svg b/_site/assets/fonts/fontawesome-webfont.svg new file mode 100644 index 000000000..855c845e5 --- /dev/null +++ b/_site/assets/fonts/fontawesome-webfont.svg @@ -0,0 +1,2671 @@ + + + + +Created by FontForge 20120731 at Mon Oct 24 17:37:40 2016 + By ,,, +Copyright Dave Gandy 2016. All rights reserved. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/_site/assets/fonts/fontawesome-webfont.ttf b/_site/assets/fonts/fontawesome-webfont.ttf new file mode 100644 index 000000000..35acda2fa Binary files /dev/null and b/_site/assets/fonts/fontawesome-webfont.ttf differ diff --git a/_site/assets/fonts/fontawesome-webfont.woff b/_site/assets/fonts/fontawesome-webfont.woff new file mode 100644 index 000000000..400014a4b Binary files /dev/null and b/_site/assets/fonts/fontawesome-webfont.woff differ diff --git a/_site/assets/fonts/fontawesome-webfont.woff2 b/_site/assets/fonts/fontawesome-webfont.woff2 new file mode 100644 index 000000000..4d13fc604 Binary files /dev/null and b/_site/assets/fonts/fontawesome-webfont.woff2 differ diff --git a/_site/assets/fonts/liberation-mono-webfont.eot b/_site/assets/fonts/liberation-mono-webfont.eot new file mode 100644 index 000000000..3c18afb17 Binary files /dev/null and b/_site/assets/fonts/liberation-mono-webfont.eot differ diff --git a/_site/assets/fonts/liberation-mono-webfont.svg b/_site/assets/fonts/liberation-mono-webfont.svg new file mode 100644 index 000000000..6e020acb4 --- /dev/null +++ b/_site/assets/fonts/liberation-mono-webfont.svg @@ -0,0 +1,153 @@ + + + + +This is a custom SVG webfont generated by Font Squirrel. +Copyright : Digitized data 2007 Ascender Corporation All rights reserved +Designer : Steve Matteson +Foundry : Ascender Corporation +Foundry URL : httpwwwascendercorpcom + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/_site/assets/fonts/liberation-mono-webfont.ttf b/_site/assets/fonts/liberation-mono-webfont.ttf new file mode 100644 index 000000000..c468528c5 Binary files /dev/null and b/_site/assets/fonts/liberation-mono-webfont.ttf differ diff --git a/_site/assets/fonts/liberation-mono-webfont.woff b/_site/assets/fonts/liberation-mono-webfont.woff new file mode 100644 index 000000000..e4e6db866 Binary files /dev/null and b/_site/assets/fonts/liberation-mono-webfont.woff differ diff --git a/_site/assets/fonts/weblysleekuil.eot b/_site/assets/fonts/weblysleekuil.eot new file mode 100644 index 000000000..5ead7d749 Binary files /dev/null and b/_site/assets/fonts/weblysleekuil.eot differ diff --git a/_site/assets/fonts/weblysleekuil.svg b/_site/assets/fonts/weblysleekuil.svg new file mode 100644 index 000000000..a07e74880 --- /dev/null +++ b/_site/assets/fonts/weblysleekuil.svg @@ -0,0 +1,967 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/_site/assets/fonts/weblysleekuil.ttf b/_site/assets/fonts/weblysleekuil.ttf new file mode 100644 index 000000000..6c0a55810 Binary files /dev/null and b/_site/assets/fonts/weblysleekuil.ttf differ diff --git a/_site/assets/fonts/weblysleekuil.woff b/_site/assets/fonts/weblysleekuil.woff new file mode 100644 index 000000000..565ff8bea Binary files /dev/null and b/_site/assets/fonts/weblysleekuil.woff differ diff --git a/_site/assets/fonts/weblysleekuil.woff2 b/_site/assets/fonts/weblysleekuil.woff2 new file mode 100644 index 000000000..80d42312c Binary files /dev/null and b/_site/assets/fonts/weblysleekuil.woff2 differ diff --git a/_site/assets/js/canvas.js b/_site/assets/js/canvas.js new file mode 100644 index 000000000..13b3491da --- /dev/null +++ b/_site/assets/js/canvas.js @@ -0,0 +1 @@ +$(function(){var canvas=document.querySelector('canvas'),ctx=canvas.getContext('2d'),color='#4079b7';canvas.width=window.innerWidth;canvas.height=window.innerHeight;canvas.style.display='block';ctx.fillStyle=color;ctx.lineWidth=.1;ctx.strokeStyle=color;var dots={nb:500,distance:80,d_radius:150,array:[]};function Dot() {this.x=Math.random()*canvas.width;this.y=Math.random()*canvas.height;this.vx=-.5+Math.random();this.vy=-.5+Math.random();this.radius=Math.random();}Dot.prototype={create:function(){ctx.beginPath();ctx.arc(this.x,this.y,this.radius,0,Math.PI*2,false);ctx.fill();}};function makeDots(){for(i=0;icanvas.height){dot.vx=dot.vx;dot.vy=-dot.vy;}else if(dot.x<0||dot.x>canvas.width){dot.vx=-dot.vx;dot.vy=dot.vy;}dot.x+=dot.vx;dot.y+=dot.vy;}}function animateDots(){ctx.clearRect(0, 0, canvas.width, canvas.height);for(i=0;i0&&t-1 in e}function r(e,t,n){if(oe.isFunction(t))return oe.grep(e,function(e,r){return!!t.call(e,r,e)!==n});if(t.nodeType)return oe.grep(e,function(e){return e===t!==n});if("string"==typeof t){if(me.test(t))return oe.filter(t,e,n);t=oe.filter(t,e)}return oe.grep(e,function(e){return J.call(t,e)>-1!==n})}function i(e,t){for(;(e=e[t])&&1!==e.nodeType;);return e}function o(e){var t={};return oe.each(e.match(we)||[],function(e,n){t[n]=!0}),t}function a(){G.removeEventListener("DOMContentLoaded",a),e.removeEventListener("load",a),oe.ready()}function s(){this.expando=oe.expando+s.uid++}function u(e,t,n){var r;if(void 0===n&&1===e.nodeType)if(r="data-"+t.replace(je,"-$&").toLowerCase(),n=e.getAttribute(r),"string"==typeof n){try{n="true"===n?!0:"false"===n?!1:"null"===n?null:+n+""===n?+n:Ne.test(n)?oe.parseJSON(n):n}catch(i){}Se.set(e,t,n)}else n=void 0;return n}function l(e,t,n,r){var i,o=1,a=20,s=r?function(){return r.cur()}:function(){return oe.css(e,t,"")},u=s(),l=n&&n[3]||(oe.cssNumber[t]?"":"px"),c=(oe.cssNumber[t]||"px"!==l&&+u)&&Ie.exec(oe.css(e,t));if(c&&c[3]!==l){l=l||c[3],n=n||[],c=+u||1;do o=o||".5",c/=o,oe.style(e,t,c+l);while(o!==(o=s()/u)&&1!==o&&--a)}return n&&(c=+c||+u||0,i=n[1]?c+(n[1]+1)*n[2]:+n[2],r&&(r.unit=l,r.start=c,r.end=i)),i}function c(e,t){var n="undefined"!=typeof e.getElementsByTagName?e.getElementsByTagName(t||"*"):"undefined"!=typeof e.querySelectorAll?e.querySelectorAll(t||"*"):[];return void 0===t||t&&oe.nodeName(e,t)?oe.merge([e],n):n}function f(e,t){for(var n=0,r=e.length;r>n;n++)Ee.set(e[n],"globalEval",!t||Ee.get(t[n],"globalEval"))}function d(e,t,n,r,i){for(var o,a,s,u,l,d,p=t.createDocumentFragment(),h=[],m=0,g=e.length;g>m;m++)if(o=e[m],o||0===o)if("object"===oe.type(o))oe.merge(h,o.nodeType?[o]:o);else if(Me.test(o)){for(a=a||p.appendChild(t.createElement("div")),s=(Oe.exec(o)||["",""])[1].toLowerCase(),u=qe[s]||qe._default,a.innerHTML=u[1]+oe.htmlPrefilter(o)+u[2],d=u[0];d--;)a=a.lastChild;oe.merge(h,a.childNodes),a=p.firstChild,a.textContent=""}else h.push(t.createTextNode(o));for(p.textContent="",m=0;o=h[m++];)if(r&&oe.inArray(o,r)>-1)i&&i.push(o);else if(l=oe.contains(o.ownerDocument,o),a=c(p.appendChild(o),"script"),l&&f(a),n)for(d=0;o=a[d++];)He.test(o.type||"")&&n.push(o);return p}function p(){return!0}function h(){return!1}function m(){try{return G.activeElement}catch(e){}}function g(e,t,n,r,i,o){var a,s;if("object"==typeof t){"string"!=typeof n&&(r=r||n,n=void 0);for(s in t)g(e,s,n,r,t[s],o);return e}if(null==r&&null==i?(i=n,r=n=void 0):null==i&&("string"==typeof n?(i=r,r=void 0):(i=r,r=n,n=void 0)),i===!1)i=h;else if(!i)return e;return 1===o&&(a=i,i=function(e){return oe().off(e),a.apply(this,arguments)},i.guid=a.guid||(a.guid=oe.guid++)),e.each(function(){oe.event.add(this,t,i,r,n)})}function v(e,t){return oe.nodeName(e,"table")&&oe.nodeName(11!==t.nodeType?t:t.firstChild,"tr")?e.getElementsByTagName("tbody")[0]||e.appendChild(e.ownerDocument.createElement("tbody")):e}function y(e){return e.type=(null!==e.getAttribute("type"))+"/"+e.type,e}function x(e){var t=$e.exec(e.type);return t?e.type=t[1]:e.removeAttribute("type"),e}function b(e,t){var n,r,i,o,a,s,u,l;if(1===t.nodeType){if(Ee.hasData(e)&&(o=Ee.access(e),a=Ee.set(t,o),l=o.events)){delete a.handle,a.events={};for(i in l)for(n=0,r=l[i].length;r>n;n++)oe.event.add(t,i,l[i][n])}Se.hasData(e)&&(s=Se.access(e),u=oe.extend({},s),Se.set(t,u))}}function w(e,t){var n=t.nodeName.toLowerCase();"input"===n&&Pe.test(e.type)?t.checked=e.checked:"input"!==n&&"textarea"!==n||(t.defaultValue=e.defaultValue)}function C(e,t,n,r){t=Z.apply([],t);var i,o,a,s,u,l,f=0,p=e.length,h=p-1,m=t[0],g=oe.isFunction(m);if(g||p>1&&"string"==typeof m&&!re.checkClone&&We.test(m))return e.each(function(i){var o=e.eq(i);g&&(t[0]=m.call(this,i,o.html())),C(o,t,n,r)});if(p&&(i=d(t,e[0].ownerDocument,!1,e,r),o=i.firstChild,1===i.childNodes.length&&(i=o),o||r)){for(a=oe.map(c(i,"script"),y),s=a.length;p>f;f++)u=i,f!==h&&(u=oe.clone(u,!0,!0),s&&oe.merge(a,c(u,"script"))),n.call(e[f],u,f);if(s)for(l=a[a.length-1].ownerDocument,oe.map(a,x),f=0;s>f;f++)u=a[f],He.test(u.type||"")&&!Ee.access(u,"globalEval")&&oe.contains(l,u)&&(u.src?oe._evalUrl&&oe._evalUrl(u.src):oe.globalEval(u.textContent.replace(Xe,"")))}return e}function T(e,t,n){for(var r,i=t?oe.filter(t,e):e,o=0;null!=(r=i[o]);o++)n||1!==r.nodeType||oe.cleanData(c(r)),r.parentNode&&(n&&oe.contains(r.ownerDocument,r)&&f(c(r,"script")),r.parentNode.removeChild(r));return e}function k(e,t){var n=oe(t.createElement(e)).appendTo(t.body),r=oe.css(n[0],"display");return n.detach(),r}function E(e){var t=G,n=Ve[e];return n||(n=k(e,t),"none"!==n&&n||(Ue=(Ue||oe("',srcAction:"iframe_src",patterns:{youtube:{index:"youtube.com",id:"v=",src:"//www.youtube.com/embed/%id%?autoplay=1"},vimeo:{index:"vimeo.com/",id:"/",src:"//player.vimeo.com/video/%id%?autoplay=1"},gmaps:{index:"//maps.google.",src:"%id%&output=embed"}}},proto:{initIframe:function(){t.types.push(R),C("BeforeChange",function(e,t,n){t!==n&&(t===R?W():n===R&&W(!0))}),C(s+"."+R,function(){W()})},getIframe:function(n,r){var i=n.src,o=t.st.iframe;e.each(o.patterns,function(){return i.indexOf(this.index)>-1?(this.id&&(i="string"==typeof this.id?i.substr(i.lastIndexOf(this.id)+this.id.length,i.length):this.id.call(this,i)),i=this.src.replace("%id%",i),!1):void 0});var a={};return o.srcAction&&(a[o.srcAction]=i),t._parseMarkup(r,a,n),t.updateStatus("ready"),r}}});var $=function(e){var n=t.items.length;return e>n-1?e-n:0>e?n+e:e},X=function(e,t,n){return e.replace(/%curr%/gi,t+1).replace(/%total%/gi,n)};e.magnificPopup.registerModule("gallery",{options:{enabled:!1,arrowMarkup:'',preload:[0,2],navigateByImgClick:!0,arrows:!0,tPrev:"Previous (Left arrow key)",tNext:"Next (Right arrow key)",tCounter:"%curr% of %total%"},proto:{initGallery:function(){var n=t.st.gallery,i=".mfp-gallery";return t.direction=!0,n&&n.enabled?(o+=" mfp-gallery",C(d+i,function(){n.navigateByImgClick&&t.wrap.on("click"+i,".mfp-img",function(){return t.items.length>1?(t.next(),!1):void 0}),r.on("keydown"+i,function(e){37===e.keyCode?t.prev():39===e.keyCode&&t.next()})}),C("UpdateStatus"+i,function(e,n){n.text&&(n.text=X(n.text,t.currItem.index,t.items.length))}),C(f+i,function(e,r,i,o){var a=t.items.length;i.counter=a>1?X(n.tCounter,o.index,a):""}),C("BuildControls"+i,function(){if(t.items.length>1&&n.arrows&&!t.arrowLeft){var r=n.arrowMarkup,i=t.arrowLeft=e(r.replace(/%title%/gi,n.tPrev).replace(/%dir%/gi,"left")).addClass(y),o=t.arrowRight=e(r.replace(/%title%/gi,n.tNext).replace(/%dir%/gi,"right")).addClass(y);i.click(function(){t.prev()}),o.click(function(){t.next()}),t.container.append(i.add(o))}}),C(p+i,function(){t._preloadTimeout&&clearTimeout(t._preloadTimeout),t._preloadTimeout=setTimeout(function(){t.preloadNearbyImages(),t._preloadTimeout=null},16)}),C(s+i,function(){r.off(i),t.wrap.off("click"+i),t.arrowRight=t.arrowLeft=null}),void 0):!1},next:function(){t.direction=!0,t.index=$(t.index+1),t.updateItemHTML()},prev:function(){t.direction=!1,t.index=$(t.index-1),t.updateItemHTML()},goTo:function(e){t.direction=e>=t.index,t.index=e,t.updateItemHTML()},preloadNearbyImages:function(){var e,n=t.st.gallery.preload,r=Math.min(n[0],t.items.length),i=Math.min(n[1],t.items.length);for(e=1;e<=(t.direction?i:r);e++)t._preloadItem(t.index+e);for(e=1;e<=(t.direction?r:i);e++)t._preloadItem(t.index-e)},_preloadItem:function(n){if(n=$(n),!t.items[n].preloaded){var r=t.items[n];r.parsed||(r=t.parseEl(n)),k("LazyLoad",r),"image"===r.type&&(r.img=e('').on("load.mfploader",function(){r.hasSize=!0}).on("error.mfploader",function(){r.hasSize=!0,r.loadError=!0,k("LazyLoadError",r)}).attr("src",r.src)),r.preloaded=!0}}}});var U="retina";e.magnificPopup.registerModule(U,{options:{replaceSrc:function(e){return e.src.replace(/\.\w+$/,function(e){return"@2x"+e})},ratio:1},proto:{initRetina:function(){if(window.devicePixelRatio>1){var e=t.st.retina,n=e.ratio;n=isNaN(n)?n():n,n>1&&(C("ImageHasSize."+U,function(e,t){t.img.css({"max-width":t.img[0].naturalWidth/n,width:"100%"})}),C("ElementParse."+U,function(t,r){r.src=e.replaceSrc(r,n)}))}}}}),S()}),$("a[href$='.jpg'],a[href$='.jpeg'],a[href$='.JPG'],a[href$='.png'],a[href$='.gif']").addClass("image-popup"),$(function(){$(".content").fitVids()}),$(".projects-menu-icon").click(function(){$("html").toggleClass("no-scroll"),$(this).toggleClass("active"),$(".overlay").toggleClass("show")}),$(document).ready(function(){$(".image-popup").magnificPopup({type:"image",tLoading:"Loading image #%curr%...",gallery:{enabled:!0,navigateByImgClick:!0,preload:[0,1]},image:{tError:'Image #%curr% could not be loaded.'},removalDelay:300,mainClass:"mfp-fade"})}); diff --git a/_site/assets/js/simple-jekyll-search.js b/_site/assets/js/simple-jekyll-search.js new file mode 100644 index 000000000..e2fdfe093 --- /dev/null +++ b/_site/assets/js/simple-jekyll-search.js @@ -0,0 +1,419 @@ +/*! + * Simple-Jekyll-Search v1.7.2 (https://github.com/christian-fei/Simple-Jekyll-Search) + * Copyright 2015-2018, Christian Fei + * Licensed under the MIT License. + */ + +(function(){ + /* globals ActiveXObject:false */ + + 'use strict' + + var _$JSONLoader_2 = { + load: load + } + + function load (location, callback) { + var xhr = getXHR() + xhr.open('GET', location, true) + xhr.onreadystatechange = createStateChangeListener(xhr, callback) + xhr.send() + } + + function createStateChangeListener (xhr, callback) { + return function () { + if (xhr.readyState === 4 && xhr.status === 200) { + try { + callback(null, JSON.parse(xhr.responseText)) + } catch (err) { + callback(err, null) + } + } + } + } + + function getXHR () { + return window.XMLHttpRequest ? new window.XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP') + } + + 'use strict' + + var _$OptionsValidator_3 = function OptionsValidator (params) { + if (!validateParams(params)) { + throw new Error('-- OptionsValidator: required options missing') + } + + if (!(this instanceof OptionsValidator)) { + return new OptionsValidator(params) + } + + var requiredOptions = params.required + + this.getRequiredOptions = function () { + return requiredOptions + } + + this.validate = function (parameters) { + var errors = [] + requiredOptions.forEach(function (requiredOptionName) { + if (typeof parameters[requiredOptionName] === 'undefined') { + errors.push(requiredOptionName) + } + }) + return errors + } + + function validateParams (params) { + if (!params) { + return false + } + return typeof params.required !== 'undefined' && params.required instanceof Array + } + } + + 'use strict'; + + function fuzzysearch (needle, haystack) { + var tlen = haystack.length; + var qlen = needle.length; + if (qlen > tlen) { + return false; + } + if (qlen === tlen) { + return needle === haystack; + } + outer: for (var i = 0, j = 0; i < qlen; i++) { + var nch = needle.charCodeAt(i); + while (j < tlen) { + if (haystack.charCodeAt(j++) === nch) { + continue outer; + } + } + return false; + } + return true; + } + + var _$fuzzysearch_1 = fuzzysearch; + + 'use strict' + + /* removed: var _$fuzzysearch_1 = require('fuzzysearch') */; + + var _$FuzzySearchStrategy_5 = new FuzzySearchStrategy() + + function FuzzySearchStrategy () { + this.matches = function (string, crit) { + return _$fuzzysearch_1(crit.toLowerCase(), string.toLowerCase()) + } + } + + 'use strict' + + var _$LiteralSearchStrategy_6 = new LiteralSearchStrategy() + + function LiteralSearchStrategy () { + this.matches = function (str, crit) { + if (!str) return false + + str = str.trim().toLowerCase() + crit = crit.trim().toLowerCase() + + return crit.split(' ').filter(function (word) { + return str.indexOf(word) >= 0 + }).length === crit.split(' ').length + } + } + + 'use strict' + + var _$Repository_4 = { + put: put, + clear: clear, + search: search, + setOptions: setOptions + } + + /* removed: var _$FuzzySearchStrategy_5 = require('./SearchStrategies/FuzzySearchStrategy') */; + /* removed: var _$LiteralSearchStrategy_6 = require('./SearchStrategies/LiteralSearchStrategy') */; + + function NoSort () { + return 0 + } + + var data = [] + var opt = {} + + opt.fuzzy = false + opt.limit = 10 + opt.searchStrategy = opt.fuzzy ? _$FuzzySearchStrategy_5 : _$LiteralSearchStrategy_6 + opt.sort = NoSort + + function put (data) { + if (isObject(data)) { + return addObject(data) + } + if (isArray(data)) { + return addArray(data) + } + return undefined + } + function clear () { + data.length = 0 + return data + } + + function isObject (obj) { + return Boolean(obj) && Object.prototype.toString.call(obj) === '[object Object]' + } + + function isArray (obj) { + return Boolean(obj) && Object.prototype.toString.call(obj) === '[object Array]' + } + + function addObject (_data) { + data.push(_data) + return data + } + + function addArray (_data) { + var added = [] + clear() + for (var i = 0, len = _data.length; i < len; i++) { + if (isObject(_data[i])) { + added.push(addObject(_data[i])) + } + } + return added + } + + function search (crit) { + if (!crit) { + return [] + } + return findMatches(data, crit, opt.searchStrategy, opt).sort(opt.sort) + } + + function setOptions (_opt) { + opt = _opt || {} + + opt.fuzzy = _opt.fuzzy || false + opt.limit = _opt.limit || 10 + opt.searchStrategy = _opt.fuzzy ? _$FuzzySearchStrategy_5 : _$LiteralSearchStrategy_6 + opt.sort = _opt.sort || NoSort + } + + function findMatches (data, crit, strategy, opt) { + var matches = [] + for (var i = 0; i < data.length && matches.length < opt.limit; i++) { + var match = findMatchesInObject(data[i], crit, strategy, opt) + if (match) { + matches.push(match) + } + } + return matches + } + + function findMatchesInObject (obj, crit, strategy, opt) { + for (var key in obj) { + if (!isExcluded(obj[key], opt.exclude) && strategy.matches(obj[key], crit)) { + return obj + } + } + } + + function isExcluded (term, excludedTerms) { + var excluded = false + excludedTerms = excludedTerms || [] + for (var i = 0, len = excludedTerms.length; i < len; i++) { + var excludedTerm = excludedTerms[i] + if (!excluded && new RegExp(term).test(excludedTerm)) { + excluded = true + } + } + return excluded + } + + 'use strict' + + var _$Templater_7 = { + compile: compile, + setOptions: __setOptions_7 + } + + var options = {} + options.pattern = /\{(.*?)\}/g + options.template = '' + options.middleware = function () {} + + function __setOptions_7 (_options) { + options.pattern = _options.pattern || options.pattern + options.template = _options.template || options.template + if (typeof _options.middleware === 'function') { + options.middleware = _options.middleware + } + } + + function compile (data) { + return options.template.replace(options.pattern, function (match, prop) { + var value = options.middleware(prop, data[prop], options.template) + if (typeof value !== 'undefined') { + return value + } + return data[prop] || match + }) + } + + 'use strict' + + var _$utils_9 = { + merge: merge, + isJSON: isJSON + } + + function merge (defaultParams, mergeParams) { + var mergedOptions = {} + for (var option in defaultParams) { + mergedOptions[option] = defaultParams[option] + if (typeof mergeParams[option] !== 'undefined') { + mergedOptions[option] = mergeParams[option] + } + } + return mergedOptions + } + + function isJSON (json) { + try { + if (json instanceof Object && JSON.parse(JSON.stringify(json))) { + return true + } + return false + } catch (err) { + return false + } + } + + var _$src_8 = {}; + (function (window) { + 'use strict' + + var options = { + searchInput: null, + resultsContainer: null, + json: [], + success: Function.prototype, + searchResultTemplate: '
  • {title}
    • ', + templateMiddleware: Function.prototype, + sortMiddleware: function () { + return 0 + }, + noResultsText: 'No results found', + limit: 10, + fuzzy: false, + exclude: [] + } + + var requiredOptions = ['searchInput', 'resultsContainer', 'json'] + + /* removed: var _$Templater_7 = require('./Templater') */; + /* removed: var _$Repository_4 = require('./Repository') */; + /* removed: var _$JSONLoader_2 = require('./JSONLoader') */; + var optionsValidator = _$OptionsValidator_3({ + required: requiredOptions + }) + /* removed: var _$utils_9 = require('./utils') */; + + window.SimpleJekyllSearch = function (_options) { + var errors = optionsValidator.validate(_options) + if (errors.length > 0) { + throwError('You must specify the following required options: ' + requiredOptions) + } + + options = _$utils_9.merge(options, _options) + + _$Templater_7.setOptions({ + template: options.searchResultTemplate, + middleware: options.templateMiddleware + }) + + _$Repository_4.setOptions({ + fuzzy: options.fuzzy, + limit: options.limit, + sort: options.sortMiddleware + }) + + if (_$utils_9.isJSON(options.json)) { + initWithJSON(options.json) + } else { + initWithURL(options.json) + } + + return { + search: search + } + } + + function initWithJSON (json) { + options.success(json) + _$Repository_4.put(json) + registerInput() + } + + function initWithURL (url) { + _$JSONLoader_2.load(url, function (err, json) { + if (err) { + throwError('failed to get JSON (' + url + ')') + } + initWithJSON(json) + }) + } + + function emptyResultsContainer () { + options.resultsContainer.innerHTML = '' + } + + function appendToResultsContainer (text) { + options.resultsContainer.innerHTML += text + } + + function registerInput () { + options.searchInput.addEventListener('keyup', function (e) { + if (isWhitelistedKey(e.which)) { + emptyResultsContainer() + search(e.target.value) + } + }) + } + + function search (query) { + if (isValidQuery(query)) { + emptyResultsContainer() + render(_$Repository_4.search(query), query) + } + } + + function render (results, query) { + var len = results.length + if (len === 0) { + return appendToResultsContainer(options.noResultsText) + } + for (var i = 0; i < len; i++) { + results[i].query = query + appendToResultsContainer(_$Templater_7.compile(results[i])) + } + } + + function isValidQuery (query) { + return query && query.length > 0 + } + + function isWhitelistedKey (key) { + return [13, 16, 20, 37, 38, 39, 40, 91].indexOf(key) === -1 + } + + function throwError (message) { + throw new Error('SimpleJekyllSearch --- ' + message) + } + })(window) + +}()); diff --git a/_site/assets/js/src/jquery-2.2.3.min.js b/_site/assets/js/src/jquery-2.2.3.min.js new file mode 100644 index 000000000..b8c4187de --- /dev/null +++ b/_site/assets/js/src/jquery-2.2.3.min.js @@ -0,0 +1,4 @@ +/*! jQuery v2.2.3 | (c) jQuery Foundation | jquery.org/license */ +!function(a,b){"object"==typeof module&&"object"==typeof module.exports?module.exports=a.document?b(a,!0):function(a){if(!a.document)throw new Error("jQuery requires a window with a document");return b(a)}:b(a)}("undefined"!=typeof window?window:this,function(a,b){var c=[],d=a.document,e=c.slice,f=c.concat,g=c.push,h=c.indexOf,i={},j=i.toString,k=i.hasOwnProperty,l={},m="2.2.3",n=function(a,b){return new n.fn.init(a,b)},o=/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g,p=/^-ms-/,q=/-([\da-z])/gi,r=function(a,b){return b.toUpperCase()};n.fn=n.prototype={jquery:m,constructor:n,selector:"",length:0,toArray:function(){return e.call(this)},get:function(a){return null!=a?0>a?this[a+this.length]:this[a]:e.call(this)},pushStack:function(a){var b=n.merge(this.constructor(),a);return b.prevObject=this,b.context=this.context,b},each:function(a){return n.each(this,a)},map:function(a){return this.pushStack(n.map(this,function(b,c){return a.call(b,c,b)}))},slice:function(){return this.pushStack(e.apply(this,arguments))},first:function(){return this.eq(0)},last:function(){return this.eq(-1)},eq:function(a){var b=this.length,c=+a+(0>a?b:0);return this.pushStack(c>=0&&b>c?[this[c]]:[])},end:function(){return this.prevObject||this.constructor()},push:g,sort:c.sort,splice:c.splice},n.extend=n.fn.extend=function(){var a,b,c,d,e,f,g=arguments[0]||{},h=1,i=arguments.length,j=!1;for("boolean"==typeof g&&(j=g,g=arguments[h]||{},h++),"object"==typeof g||n.isFunction(g)||(g={}),h===i&&(g=this,h--);i>h;h++)if(null!=(a=arguments[h]))for(b in a)c=g[b],d=a[b],g!==d&&(j&&d&&(n.isPlainObject(d)||(e=n.isArray(d)))?(e?(e=!1,f=c&&n.isArray(c)?c:[]):f=c&&n.isPlainObject(c)?c:{},g[b]=n.extend(j,f,d)):void 0!==d&&(g[b]=d));return g},n.extend({expando:"jQuery"+(m+Math.random()).replace(/\D/g,""),isReady:!0,error:function(a){throw new Error(a)},noop:function(){},isFunction:function(a){return"function"===n.type(a)},isArray:Array.isArray,isWindow:function(a){return null!=a&&a===a.window},isNumeric:function(a){var b=a&&a.toString();return!n.isArray(a)&&b-parseFloat(b)+1>=0},isPlainObject:function(a){var b;if("object"!==n.type(a)||a.nodeType||n.isWindow(a))return!1;if(a.constructor&&!k.call(a,"constructor")&&!k.call(a.constructor.prototype||{},"isPrototypeOf"))return!1;for(b in a);return void 0===b||k.call(a,b)},isEmptyObject:function(a){var b;for(b in a)return!1;return!0},type:function(a){return null==a?a+"":"object"==typeof a||"function"==typeof a?i[j.call(a)]||"object":typeof a},globalEval:function(a){var b,c=eval;a=n.trim(a),a&&(1===a.indexOf("use strict")?(b=d.createElement("script"),b.text=a,d.head.appendChild(b).parentNode.removeChild(b)):c(a))},camelCase:function(a){return a.replace(p,"ms-").replace(q,r)},nodeName:function(a,b){return a.nodeName&&a.nodeName.toLowerCase()===b.toLowerCase()},each:function(a,b){var c,d=0;if(s(a)){for(c=a.length;c>d;d++)if(b.call(a[d],d,a[d])===!1)break}else for(d in a)if(b.call(a[d],d,a[d])===!1)break;return a},trim:function(a){return null==a?"":(a+"").replace(o,"")},makeArray:function(a,b){var c=b||[];return null!=a&&(s(Object(a))?n.merge(c,"string"==typeof a?[a]:a):g.call(c,a)),c},inArray:function(a,b,c){return null==b?-1:h.call(b,a,c)},merge:function(a,b){for(var c=+b.length,d=0,e=a.length;c>d;d++)a[e++]=b[d];return a.length=e,a},grep:function(a,b,c){for(var d,e=[],f=0,g=a.length,h=!c;g>f;f++)d=!b(a[f],f),d!==h&&e.push(a[f]);return e},map:function(a,b,c){var d,e,g=0,h=[];if(s(a))for(d=a.length;d>g;g++)e=b(a[g],g,c),null!=e&&h.push(e);else for(g in a)e=b(a[g],g,c),null!=e&&h.push(e);return f.apply([],h)},guid:1,proxy:function(a,b){var c,d,f;return"string"==typeof b&&(c=a[b],b=a,a=c),n.isFunction(a)?(d=e.call(arguments,2),f=function(){return a.apply(b||this,d.concat(e.call(arguments)))},f.guid=a.guid=a.guid||n.guid++,f):void 0},now:Date.now,support:l}),"function"==typeof Symbol&&(n.fn[Symbol.iterator]=c[Symbol.iterator]),n.each("Boolean Number String Function Array Date RegExp Object Error Symbol".split(" "),function(a,b){i["[object "+b+"]"]=b.toLowerCase()});function s(a){var b=!!a&&"length"in a&&a.length,c=n.type(a);return"function"===c||n.isWindow(a)?!1:"array"===c||0===b||"number"==typeof b&&b>0&&b-1 in a}var t=function(a){var b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u="sizzle"+1*new Date,v=a.document,w=0,x=0,y=ga(),z=ga(),A=ga(),B=function(a,b){return a===b&&(l=!0),0},C=1<<31,D={}.hasOwnProperty,E=[],F=E.pop,G=E.push,H=E.push,I=E.slice,J=function(a,b){for(var c=0,d=a.length;d>c;c++)if(a[c]===b)return c;return-1},K="checked|selected|async|autofocus|autoplay|controls|defer|disabled|hidden|ismap|loop|multiple|open|readonly|required|scoped",L="[\\x20\\t\\r\\n\\f]",M="(?:\\\\.|[\\w-]|[^\\x00-\\xa0])+",N="\\["+L+"*("+M+")(?:"+L+"*([*^$|!~]?=)"+L+"*(?:'((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\"|("+M+"))|)"+L+"*\\]",O=":("+M+")(?:\\((('((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\")|((?:\\\\.|[^\\\\()[\\]]|"+N+")*)|.*)\\)|)",P=new RegExp(L+"+","g"),Q=new RegExp("^"+L+"+|((?:^|[^\\\\])(?:\\\\.)*)"+L+"+$","g"),R=new RegExp("^"+L+"*,"+L+"*"),S=new RegExp("^"+L+"*([>+~]|"+L+")"+L+"*"),T=new RegExp("="+L+"*([^\\]'\"]*?)"+L+"*\\]","g"),U=new RegExp(O),V=new RegExp("^"+M+"$"),W={ID:new RegExp("^#("+M+")"),CLASS:new RegExp("^\\.("+M+")"),TAG:new RegExp("^("+M+"|[*])"),ATTR:new RegExp("^"+N),PSEUDO:new RegExp("^"+O),CHILD:new RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\("+L+"*(even|odd|(([+-]|)(\\d*)n|)"+L+"*(?:([+-]|)"+L+"*(\\d+)|))"+L+"*\\)|)","i"),bool:new RegExp("^(?:"+K+")$","i"),needsContext:new RegExp("^"+L+"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\("+L+"*((?:-\\d)?\\d*)"+L+"*\\)|)(?=[^-]|$)","i")},X=/^(?:input|select|textarea|button)$/i,Y=/^h\d$/i,Z=/^[^{]+\{\s*\[native \w/,$=/^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,_=/[+~]/,aa=/'|\\/g,ba=new RegExp("\\\\([\\da-f]{1,6}"+L+"?|("+L+")|.)","ig"),ca=function(a,b,c){var d="0x"+b-65536;return d!==d||c?b:0>d?String.fromCharCode(d+65536):String.fromCharCode(d>>10|55296,1023&d|56320)},da=function(){m()};try{H.apply(E=I.call(v.childNodes),v.childNodes),E[v.childNodes.length].nodeType}catch(ea){H={apply:E.length?function(a,b){G.apply(a,I.call(b))}:function(a,b){var c=a.length,d=0;while(a[c++]=b[d++]);a.length=c-1}}}function fa(a,b,d,e){var f,h,j,k,l,o,r,s,w=b&&b.ownerDocument,x=b?b.nodeType:9;if(d=d||[],"string"!=typeof a||!a||1!==x&&9!==x&&11!==x)return d;if(!e&&((b?b.ownerDocument||b:v)!==n&&m(b),b=b||n,p)){if(11!==x&&(o=$.exec(a)))if(f=o[1]){if(9===x){if(!(j=b.getElementById(f)))return d;if(j.id===f)return d.push(j),d}else if(w&&(j=w.getElementById(f))&&t(b,j)&&j.id===f)return d.push(j),d}else{if(o[2])return H.apply(d,b.getElementsByTagName(a)),d;if((f=o[3])&&c.getElementsByClassName&&b.getElementsByClassName)return H.apply(d,b.getElementsByClassName(f)),d}if(c.qsa&&!A[a+" "]&&(!q||!q.test(a))){if(1!==x)w=b,s=a;else if("object"!==b.nodeName.toLowerCase()){(k=b.getAttribute("id"))?k=k.replace(aa,"\\$&"):b.setAttribute("id",k=u),r=g(a),h=r.length,l=V.test(k)?"#"+k:"[id='"+k+"']";while(h--)r[h]=l+" "+qa(r[h]);s=r.join(","),w=_.test(a)&&oa(b.parentNode)||b}if(s)try{return H.apply(d,w.querySelectorAll(s)),d}catch(y){}finally{k===u&&b.removeAttribute("id")}}}return i(a.replace(Q,"$1"),b,d,e)}function ga(){var a=[];function b(c,e){return a.push(c+" ")>d.cacheLength&&delete b[a.shift()],b[c+" "]=e}return b}function ha(a){return a[u]=!0,a}function ia(a){var b=n.createElement("div");try{return!!a(b)}catch(c){return!1}finally{b.parentNode&&b.parentNode.removeChild(b),b=null}}function ja(a,b){var c=a.split("|"),e=c.length;while(e--)d.attrHandle[c[e]]=b}function ka(a,b){var c=b&&a,d=c&&1===a.nodeType&&1===b.nodeType&&(~b.sourceIndex||C)-(~a.sourceIndex||C);if(d)return d;if(c)while(c=c.nextSibling)if(c===b)return-1;return a?1:-1}function la(a){return function(b){var c=b.nodeName.toLowerCase();return"input"===c&&b.type===a}}function ma(a){return function(b){var c=b.nodeName.toLowerCase();return("input"===c||"button"===c)&&b.type===a}}function na(a){return ha(function(b){return b=+b,ha(function(c,d){var e,f=a([],c.length,b),g=f.length;while(g--)c[e=f[g]]&&(c[e]=!(d[e]=c[e]))})})}function oa(a){return a&&"undefined"!=typeof a.getElementsByTagName&&a}c=fa.support={},f=fa.isXML=function(a){var b=a&&(a.ownerDocument||a).documentElement;return b?"HTML"!==b.nodeName:!1},m=fa.setDocument=function(a){var b,e,g=a?a.ownerDocument||a:v;return g!==n&&9===g.nodeType&&g.documentElement?(n=g,o=n.documentElement,p=!f(n),(e=n.defaultView)&&e.top!==e&&(e.addEventListener?e.addEventListener("unload",da,!1):e.attachEvent&&e.attachEvent("onunload",da)),c.attributes=ia(function(a){return a.className="i",!a.getAttribute("className")}),c.getElementsByTagName=ia(function(a){return a.appendChild(n.createComment("")),!a.getElementsByTagName("*").length}),c.getElementsByClassName=Z.test(n.getElementsByClassName),c.getById=ia(function(a){return o.appendChild(a).id=u,!n.getElementsByName||!n.getElementsByName(u).length}),c.getById?(d.find.ID=function(a,b){if("undefined"!=typeof b.getElementById&&p){var c=b.getElementById(a);return c?[c]:[]}},d.filter.ID=function(a){var b=a.replace(ba,ca);return function(a){return a.getAttribute("id")===b}}):(delete d.find.ID,d.filter.ID=function(a){var b=a.replace(ba,ca);return function(a){var c="undefined"!=typeof a.getAttributeNode&&a.getAttributeNode("id");return c&&c.value===b}}),d.find.TAG=c.getElementsByTagName?function(a,b){return"undefined"!=typeof b.getElementsByTagName?b.getElementsByTagName(a):c.qsa?b.querySelectorAll(a):void 0}:function(a,b){var c,d=[],e=0,f=b.getElementsByTagName(a);if("*"===a){while(c=f[e++])1===c.nodeType&&d.push(c);return d}return f},d.find.CLASS=c.getElementsByClassName&&function(a,b){return"undefined"!=typeof b.getElementsByClassName&&p?b.getElementsByClassName(a):void 0},r=[],q=[],(c.qsa=Z.test(n.querySelectorAll))&&(ia(function(a){o.appendChild(a).innerHTML="",a.querySelectorAll("[msallowcapture^='']").length&&q.push("[*^$]="+L+"*(?:''|\"\")"),a.querySelectorAll("[selected]").length||q.push("\\["+L+"*(?:value|"+K+")"),a.querySelectorAll("[id~="+u+"-]").length||q.push("~="),a.querySelectorAll(":checked").length||q.push(":checked"),a.querySelectorAll("a#"+u+"+*").length||q.push(".#.+[+~]")}),ia(function(a){var b=n.createElement("input");b.setAttribute("type","hidden"),a.appendChild(b).setAttribute("name","D"),a.querySelectorAll("[name=d]").length&&q.push("name"+L+"*[*^$|!~]?="),a.querySelectorAll(":enabled").length||q.push(":enabled",":disabled"),a.querySelectorAll("*,:x"),q.push(",.*:")})),(c.matchesSelector=Z.test(s=o.matches||o.webkitMatchesSelector||o.mozMatchesSelector||o.oMatchesSelector||o.msMatchesSelector))&&ia(function(a){c.disconnectedMatch=s.call(a,"div"),s.call(a,"[s!='']:x"),r.push("!=",O)}),q=q.length&&new RegExp(q.join("|")),r=r.length&&new RegExp(r.join("|")),b=Z.test(o.compareDocumentPosition),t=b||Z.test(o.contains)?function(a,b){var c=9===a.nodeType?a.documentElement:a,d=b&&b.parentNode;return a===d||!(!d||1!==d.nodeType||!(c.contains?c.contains(d):a.compareDocumentPosition&&16&a.compareDocumentPosition(d)))}:function(a,b){if(b)while(b=b.parentNode)if(b===a)return!0;return!1},B=b?function(a,b){if(a===b)return l=!0,0;var d=!a.compareDocumentPosition-!b.compareDocumentPosition;return d?d:(d=(a.ownerDocument||a)===(b.ownerDocument||b)?a.compareDocumentPosition(b):1,1&d||!c.sortDetached&&b.compareDocumentPosition(a)===d?a===n||a.ownerDocument===v&&t(v,a)?-1:b===n||b.ownerDocument===v&&t(v,b)?1:k?J(k,a)-J(k,b):0:4&d?-1:1)}:function(a,b){if(a===b)return l=!0,0;var c,d=0,e=a.parentNode,f=b.parentNode,g=[a],h=[b];if(!e||!f)return a===n?-1:b===n?1:e?-1:f?1:k?J(k,a)-J(k,b):0;if(e===f)return ka(a,b);c=a;while(c=c.parentNode)g.unshift(c);c=b;while(c=c.parentNode)h.unshift(c);while(g[d]===h[d])d++;return d?ka(g[d],h[d]):g[d]===v?-1:h[d]===v?1:0},n):n},fa.matches=function(a,b){return fa(a,null,null,b)},fa.matchesSelector=function(a,b){if((a.ownerDocument||a)!==n&&m(a),b=b.replace(T,"='$1']"),c.matchesSelector&&p&&!A[b+" "]&&(!r||!r.test(b))&&(!q||!q.test(b)))try{var d=s.call(a,b);if(d||c.disconnectedMatch||a.document&&11!==a.document.nodeType)return d}catch(e){}return fa(b,n,null,[a]).length>0},fa.contains=function(a,b){return(a.ownerDocument||a)!==n&&m(a),t(a,b)},fa.attr=function(a,b){(a.ownerDocument||a)!==n&&m(a);var e=d.attrHandle[b.toLowerCase()],f=e&&D.call(d.attrHandle,b.toLowerCase())?e(a,b,!p):void 0;return void 0!==f?f:c.attributes||!p?a.getAttribute(b):(f=a.getAttributeNode(b))&&f.specified?f.value:null},fa.error=function(a){throw new Error("Syntax error, unrecognized expression: "+a)},fa.uniqueSort=function(a){var b,d=[],e=0,f=0;if(l=!c.detectDuplicates,k=!c.sortStable&&a.slice(0),a.sort(B),l){while(b=a[f++])b===a[f]&&(e=d.push(f));while(e--)a.splice(d[e],1)}return k=null,a},e=fa.getText=function(a){var b,c="",d=0,f=a.nodeType;if(f){if(1===f||9===f||11===f){if("string"==typeof a.textContent)return a.textContent;for(a=a.firstChild;a;a=a.nextSibling)c+=e(a)}else if(3===f||4===f)return a.nodeValue}else while(b=a[d++])c+=e(b);return c},d=fa.selectors={cacheLength:50,createPseudo:ha,match:W,attrHandle:{},find:{},relative:{">":{dir:"parentNode",first:!0}," ":{dir:"parentNode"},"+":{dir:"previousSibling",first:!0},"~":{dir:"previousSibling"}},preFilter:{ATTR:function(a){return a[1]=a[1].replace(ba,ca),a[3]=(a[3]||a[4]||a[5]||"").replace(ba,ca),"~="===a[2]&&(a[3]=" "+a[3]+" "),a.slice(0,4)},CHILD:function(a){return a[1]=a[1].toLowerCase(),"nth"===a[1].slice(0,3)?(a[3]||fa.error(a[0]),a[4]=+(a[4]?a[5]+(a[6]||1):2*("even"===a[3]||"odd"===a[3])),a[5]=+(a[7]+a[8]||"odd"===a[3])):a[3]&&fa.error(a[0]),a},PSEUDO:function(a){var b,c=!a[6]&&a[2];return W.CHILD.test(a[0])?null:(a[3]?a[2]=a[4]||a[5]||"":c&&U.test(c)&&(b=g(c,!0))&&(b=c.indexOf(")",c.length-b)-c.length)&&(a[0]=a[0].slice(0,b),a[2]=c.slice(0,b)),a.slice(0,3))}},filter:{TAG:function(a){var b=a.replace(ba,ca).toLowerCase();return"*"===a?function(){return!0}:function(a){return a.nodeName&&a.nodeName.toLowerCase()===b}},CLASS:function(a){var b=y[a+" "];return b||(b=new RegExp("(^|"+L+")"+a+"("+L+"|$)"))&&y(a,function(a){return b.test("string"==typeof a.className&&a.className||"undefined"!=typeof a.getAttribute&&a.getAttribute("class")||"")})},ATTR:function(a,b,c){return function(d){var e=fa.attr(d,a);return null==e?"!="===b:b?(e+="","="===b?e===c:"!="===b?e!==c:"^="===b?c&&0===e.indexOf(c):"*="===b?c&&e.indexOf(c)>-1:"$="===b?c&&e.slice(-c.length)===c:"~="===b?(" "+e.replace(P," ")+" ").indexOf(c)>-1:"|="===b?e===c||e.slice(0,c.length+1)===c+"-":!1):!0}},CHILD:function(a,b,c,d,e){var f="nth"!==a.slice(0,3),g="last"!==a.slice(-4),h="of-type"===b;return 1===d&&0===e?function(a){return!!a.parentNode}:function(b,c,i){var j,k,l,m,n,o,p=f!==g?"nextSibling":"previousSibling",q=b.parentNode,r=h&&b.nodeName.toLowerCase(),s=!i&&!h,t=!1;if(q){if(f){while(p){m=b;while(m=m[p])if(h?m.nodeName.toLowerCase()===r:1===m.nodeType)return!1;o=p="only"===a&&!o&&"nextSibling"}return!0}if(o=[g?q.firstChild:q.lastChild],g&&s){m=q,l=m[u]||(m[u]={}),k=l[m.uniqueID]||(l[m.uniqueID]={}),j=k[a]||[],n=j[0]===w&&j[1],t=n&&j[2],m=n&&q.childNodes[n];while(m=++n&&m&&m[p]||(t=n=0)||o.pop())if(1===m.nodeType&&++t&&m===b){k[a]=[w,n,t];break}}else if(s&&(m=b,l=m[u]||(m[u]={}),k=l[m.uniqueID]||(l[m.uniqueID]={}),j=k[a]||[],n=j[0]===w&&j[1],t=n),t===!1)while(m=++n&&m&&m[p]||(t=n=0)||o.pop())if((h?m.nodeName.toLowerCase()===r:1===m.nodeType)&&++t&&(s&&(l=m[u]||(m[u]={}),k=l[m.uniqueID]||(l[m.uniqueID]={}),k[a]=[w,t]),m===b))break;return t-=e,t===d||t%d===0&&t/d>=0}}},PSEUDO:function(a,b){var c,e=d.pseudos[a]||d.setFilters[a.toLowerCase()]||fa.error("unsupported pseudo: "+a);return e[u]?e(b):e.length>1?(c=[a,a,"",b],d.setFilters.hasOwnProperty(a.toLowerCase())?ha(function(a,c){var d,f=e(a,b),g=f.length;while(g--)d=J(a,f[g]),a[d]=!(c[d]=f[g])}):function(a){return e(a,0,c)}):e}},pseudos:{not:ha(function(a){var b=[],c=[],d=h(a.replace(Q,"$1"));return d[u]?ha(function(a,b,c,e){var f,g=d(a,null,e,[]),h=a.length;while(h--)(f=g[h])&&(a[h]=!(b[h]=f))}):function(a,e,f){return b[0]=a,d(b,null,f,c),b[0]=null,!c.pop()}}),has:ha(function(a){return function(b){return fa(a,b).length>0}}),contains:ha(function(a){return a=a.replace(ba,ca),function(b){return(b.textContent||b.innerText||e(b)).indexOf(a)>-1}}),lang:ha(function(a){return V.test(a||"")||fa.error("unsupported lang: "+a),a=a.replace(ba,ca).toLowerCase(),function(b){var c;do if(c=p?b.lang:b.getAttribute("xml:lang")||b.getAttribute("lang"))return c=c.toLowerCase(),c===a||0===c.indexOf(a+"-");while((b=b.parentNode)&&1===b.nodeType);return!1}}),target:function(b){var c=a.location&&a.location.hash;return c&&c.slice(1)===b.id},root:function(a){return a===o},focus:function(a){return a===n.activeElement&&(!n.hasFocus||n.hasFocus())&&!!(a.type||a.href||~a.tabIndex)},enabled:function(a){return a.disabled===!1},disabled:function(a){return a.disabled===!0},checked:function(a){var b=a.nodeName.toLowerCase();return"input"===b&&!!a.checked||"option"===b&&!!a.selected},selected:function(a){return a.parentNode&&a.parentNode.selectedIndex,a.selected===!0},empty:function(a){for(a=a.firstChild;a;a=a.nextSibling)if(a.nodeType<6)return!1;return!0},parent:function(a){return!d.pseudos.empty(a)},header:function(a){return Y.test(a.nodeName)},input:function(a){return X.test(a.nodeName)},button:function(a){var b=a.nodeName.toLowerCase();return"input"===b&&"button"===a.type||"button"===b},text:function(a){var b;return"input"===a.nodeName.toLowerCase()&&"text"===a.type&&(null==(b=a.getAttribute("type"))||"text"===b.toLowerCase())},first:na(function(){return[0]}),last:na(function(a,b){return[b-1]}),eq:na(function(a,b,c){return[0>c?c+b:c]}),even:na(function(a,b){for(var c=0;b>c;c+=2)a.push(c);return a}),odd:na(function(a,b){for(var c=1;b>c;c+=2)a.push(c);return a}),lt:na(function(a,b,c){for(var d=0>c?c+b:c;--d>=0;)a.push(d);return a}),gt:na(function(a,b,c){for(var d=0>c?c+b:c;++db;b++)d+=a[b].value;return d}function ra(a,b,c){var d=b.dir,e=c&&"parentNode"===d,f=x++;return b.first?function(b,c,f){while(b=b[d])if(1===b.nodeType||e)return a(b,c,f)}:function(b,c,g){var h,i,j,k=[w,f];if(g){while(b=b[d])if((1===b.nodeType||e)&&a(b,c,g))return!0}else while(b=b[d])if(1===b.nodeType||e){if(j=b[u]||(b[u]={}),i=j[b.uniqueID]||(j[b.uniqueID]={}),(h=i[d])&&h[0]===w&&h[1]===f)return k[2]=h[2];if(i[d]=k,k[2]=a(b,c,g))return!0}}}function sa(a){return a.length>1?function(b,c,d){var e=a.length;while(e--)if(!a[e](b,c,d))return!1;return!0}:a[0]}function ta(a,b,c){for(var d=0,e=b.length;e>d;d++)fa(a,b[d],c);return c}function ua(a,b,c,d,e){for(var f,g=[],h=0,i=a.length,j=null!=b;i>h;h++)(f=a[h])&&(c&&!c(f,d,e)||(g.push(f),j&&b.push(h)));return g}function va(a,b,c,d,e,f){return d&&!d[u]&&(d=va(d)),e&&!e[u]&&(e=va(e,f)),ha(function(f,g,h,i){var j,k,l,m=[],n=[],o=g.length,p=f||ta(b||"*",h.nodeType?[h]:h,[]),q=!a||!f&&b?p:ua(p,m,a,h,i),r=c?e||(f?a:o||d)?[]:g:q;if(c&&c(q,r,h,i),d){j=ua(r,n),d(j,[],h,i),k=j.length;while(k--)(l=j[k])&&(r[n[k]]=!(q[n[k]]=l))}if(f){if(e||a){if(e){j=[],k=r.length;while(k--)(l=r[k])&&j.push(q[k]=l);e(null,r=[],j,i)}k=r.length;while(k--)(l=r[k])&&(j=e?J(f,l):m[k])>-1&&(f[j]=!(g[j]=l))}}else r=ua(r===g?r.splice(o,r.length):r),e?e(null,g,r,i):H.apply(g,r)})}function wa(a){for(var b,c,e,f=a.length,g=d.relative[a[0].type],h=g||d.relative[" "],i=g?1:0,k=ra(function(a){return a===b},h,!0),l=ra(function(a){return J(b,a)>-1},h,!0),m=[function(a,c,d){var e=!g&&(d||c!==j)||((b=c).nodeType?k(a,c,d):l(a,c,d));return b=null,e}];f>i;i++)if(c=d.relative[a[i].type])m=[ra(sa(m),c)];else{if(c=d.filter[a[i].type].apply(null,a[i].matches),c[u]){for(e=++i;f>e;e++)if(d.relative[a[e].type])break;return va(i>1&&sa(m),i>1&&qa(a.slice(0,i-1).concat({value:" "===a[i-2].type?"*":""})).replace(Q,"$1"),c,e>i&&wa(a.slice(i,e)),f>e&&wa(a=a.slice(e)),f>e&&qa(a))}m.push(c)}return sa(m)}function xa(a,b){var c=b.length>0,e=a.length>0,f=function(f,g,h,i,k){var l,o,q,r=0,s="0",t=f&&[],u=[],v=j,x=f||e&&d.find.TAG("*",k),y=w+=null==v?1:Math.random()||.1,z=x.length;for(k&&(j=g===n||g||k);s!==z&&null!=(l=x[s]);s++){if(e&&l){o=0,g||l.ownerDocument===n||(m(l),h=!p);while(q=a[o++])if(q(l,g||n,h)){i.push(l);break}k&&(w=y)}c&&((l=!q&&l)&&r--,f&&t.push(l))}if(r+=s,c&&s!==r){o=0;while(q=b[o++])q(t,u,g,h);if(f){if(r>0)while(s--)t[s]||u[s]||(u[s]=F.call(i));u=ua(u)}H.apply(i,u),k&&!f&&u.length>0&&r+b.length>1&&fa.uniqueSort(i)}return k&&(w=y,j=v),t};return c?ha(f):f}return h=fa.compile=function(a,b){var c,d=[],e=[],f=A[a+" "];if(!f){b||(b=g(a)),c=b.length;while(c--)f=wa(b[c]),f[u]?d.push(f):e.push(f);f=A(a,xa(e,d)),f.selector=a}return f},i=fa.select=function(a,b,e,f){var i,j,k,l,m,n="function"==typeof a&&a,o=!f&&g(a=n.selector||a);if(e=e||[],1===o.length){if(j=o[0]=o[0].slice(0),j.length>2&&"ID"===(k=j[0]).type&&c.getById&&9===b.nodeType&&p&&d.relative[j[1].type]){if(b=(d.find.ID(k.matches[0].replace(ba,ca),b)||[])[0],!b)return e;n&&(b=b.parentNode),a=a.slice(j.shift().value.length)}i=W.needsContext.test(a)?0:j.length;while(i--){if(k=j[i],d.relative[l=k.type])break;if((m=d.find[l])&&(f=m(k.matches[0].replace(ba,ca),_.test(j[0].type)&&oa(b.parentNode)||b))){if(j.splice(i,1),a=f.length&&qa(j),!a)return H.apply(e,f),e;break}}}return(n||h(a,o))(f,b,!p,e,!b||_.test(a)&&oa(b.parentNode)||b),e},c.sortStable=u.split("").sort(B).join("")===u,c.detectDuplicates=!!l,m(),c.sortDetached=ia(function(a){return 1&a.compareDocumentPosition(n.createElement("div"))}),ia(function(a){return a.innerHTML="","#"===a.firstChild.getAttribute("href")})||ja("type|href|height|width",function(a,b,c){return c?void 0:a.getAttribute(b,"type"===b.toLowerCase()?1:2)}),c.attributes&&ia(function(a){return a.innerHTML="",a.firstChild.setAttribute("value",""),""===a.firstChild.getAttribute("value")})||ja("value",function(a,b,c){return c||"input"!==a.nodeName.toLowerCase()?void 0:a.defaultValue}),ia(function(a){return null==a.getAttribute("disabled")})||ja(K,function(a,b,c){var d;return c?void 0:a[b]===!0?b.toLowerCase():(d=a.getAttributeNode(b))&&d.specified?d.value:null}),fa}(a);n.find=t,n.expr=t.selectors,n.expr[":"]=n.expr.pseudos,n.uniqueSort=n.unique=t.uniqueSort,n.text=t.getText,n.isXMLDoc=t.isXML,n.contains=t.contains;var u=function(a,b,c){var d=[],e=void 0!==c;while((a=a[b])&&9!==a.nodeType)if(1===a.nodeType){if(e&&n(a).is(c))break;d.push(a)}return d},v=function(a,b){for(var c=[];a;a=a.nextSibling)1===a.nodeType&&a!==b&&c.push(a);return c},w=n.expr.match.needsContext,x=/^<([\w-]+)\s*\/?>(?:<\/\1>|)$/,y=/^.[^:#\[\.,]*$/;function z(a,b,c){if(n.isFunction(b))return n.grep(a,function(a,d){return!!b.call(a,d,a)!==c});if(b.nodeType)return n.grep(a,function(a){return a===b!==c});if("string"==typeof b){if(y.test(b))return n.filter(b,a,c);b=n.filter(b,a)}return n.grep(a,function(a){return h.call(b,a)>-1!==c})}n.filter=function(a,b,c){var d=b[0];return c&&(a=":not("+a+")"),1===b.length&&1===d.nodeType?n.find.matchesSelector(d,a)?[d]:[]:n.find.matches(a,n.grep(b,function(a){return 1===a.nodeType}))},n.fn.extend({find:function(a){var b,c=this.length,d=[],e=this;if("string"!=typeof a)return this.pushStack(n(a).filter(function(){for(b=0;c>b;b++)if(n.contains(e[b],this))return!0}));for(b=0;c>b;b++)n.find(a,e[b],d);return d=this.pushStack(c>1?n.unique(d):d),d.selector=this.selector?this.selector+" "+a:a,d},filter:function(a){return this.pushStack(z(this,a||[],!1))},not:function(a){return this.pushStack(z(this,a||[],!0))},is:function(a){return!!z(this,"string"==typeof a&&w.test(a)?n(a):a||[],!1).length}});var A,B=/^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]*))$/,C=n.fn.init=function(a,b,c){var e,f;if(!a)return this;if(c=c||A,"string"==typeof a){if(e="<"===a[0]&&">"===a[a.length-1]&&a.length>=3?[null,a,null]:B.exec(a),!e||!e[1]&&b)return!b||b.jquery?(b||c).find(a):this.constructor(b).find(a);if(e[1]){if(b=b instanceof n?b[0]:b,n.merge(this,n.parseHTML(e[1],b&&b.nodeType?b.ownerDocument||b:d,!0)),x.test(e[1])&&n.isPlainObject(b))for(e in b)n.isFunction(this[e])?this[e](b[e]):this.attr(e,b[e]);return this}return f=d.getElementById(e[2]),f&&f.parentNode&&(this.length=1,this[0]=f),this.context=d,this.selector=a,this}return a.nodeType?(this.context=this[0]=a,this.length=1,this):n.isFunction(a)?void 0!==c.ready?c.ready(a):a(n):(void 0!==a.selector&&(this.selector=a.selector,this.context=a.context),n.makeArray(a,this))};C.prototype=n.fn,A=n(d);var D=/^(?:parents|prev(?:Until|All))/,E={children:!0,contents:!0,next:!0,prev:!0};n.fn.extend({has:function(a){var b=n(a,this),c=b.length;return this.filter(function(){for(var a=0;c>a;a++)if(n.contains(this,b[a]))return!0})},closest:function(a,b){for(var c,d=0,e=this.length,f=[],g=w.test(a)||"string"!=typeof a?n(a,b||this.context):0;e>d;d++)for(c=this[d];c&&c!==b;c=c.parentNode)if(c.nodeType<11&&(g?g.index(c)>-1:1===c.nodeType&&n.find.matchesSelector(c,a))){f.push(c);break}return this.pushStack(f.length>1?n.uniqueSort(f):f)},index:function(a){return a?"string"==typeof a?h.call(n(a),this[0]):h.call(this,a.jquery?a[0]:a):this[0]&&this[0].parentNode?this.first().prevAll().length:-1},add:function(a,b){return this.pushStack(n.uniqueSort(n.merge(this.get(),n(a,b))))},addBack:function(a){return this.add(null==a?this.prevObject:this.prevObject.filter(a))}});function F(a,b){while((a=a[b])&&1!==a.nodeType);return a}n.each({parent:function(a){var b=a.parentNode;return b&&11!==b.nodeType?b:null},parents:function(a){return u(a,"parentNode")},parentsUntil:function(a,b,c){return u(a,"parentNode",c)},next:function(a){return F(a,"nextSibling")},prev:function(a){return F(a,"previousSibling")},nextAll:function(a){return u(a,"nextSibling")},prevAll:function(a){return u(a,"previousSibling")},nextUntil:function(a,b,c){return u(a,"nextSibling",c)},prevUntil:function(a,b,c){return u(a,"previousSibling",c)},siblings:function(a){return v((a.parentNode||{}).firstChild,a)},children:function(a){return v(a.firstChild)},contents:function(a){return a.contentDocument||n.merge([],a.childNodes)}},function(a,b){n.fn[a]=function(c,d){var e=n.map(this,b,c);return"Until"!==a.slice(-5)&&(d=c),d&&"string"==typeof d&&(e=n.filter(d,e)),this.length>1&&(E[a]||n.uniqueSort(e),D.test(a)&&e.reverse()),this.pushStack(e)}});var G=/\S+/g;function H(a){var b={};return n.each(a.match(G)||[],function(a,c){b[c]=!0}),b}n.Callbacks=function(a){a="string"==typeof a?H(a):n.extend({},a);var b,c,d,e,f=[],g=[],h=-1,i=function(){for(e=a.once,d=b=!0;g.length;h=-1){c=g.shift();while(++h-1)f.splice(c,1),h>=c&&h--}),this},has:function(a){return a?n.inArray(a,f)>-1:f.length>0},empty:function(){return f&&(f=[]),this},disable:function(){return e=g=[],f=c="",this},disabled:function(){return!f},lock:function(){return e=g=[],c||(f=c=""),this},locked:function(){return!!e},fireWith:function(a,c){return e||(c=c||[],c=[a,c.slice?c.slice():c],g.push(c),b||i()),this},fire:function(){return j.fireWith(this,arguments),this},fired:function(){return!!d}};return j},n.extend({Deferred:function(a){var b=[["resolve","done",n.Callbacks("once memory"),"resolved"],["reject","fail",n.Callbacks("once memory"),"rejected"],["notify","progress",n.Callbacks("memory")]],c="pending",d={state:function(){return c},always:function(){return e.done(arguments).fail(arguments),this},then:function(){var a=arguments;return n.Deferred(function(c){n.each(b,function(b,f){var g=n.isFunction(a[b])&&a[b];e[f[1]](function(){var a=g&&g.apply(this,arguments);a&&n.isFunction(a.promise)?a.promise().progress(c.notify).done(c.resolve).fail(c.reject):c[f[0]+"With"](this===d?c.promise():this,g?[a]:arguments)})}),a=null}).promise()},promise:function(a){return null!=a?n.extend(a,d):d}},e={};return d.pipe=d.then,n.each(b,function(a,f){var g=f[2],h=f[3];d[f[1]]=g.add,h&&g.add(function(){c=h},b[1^a][2].disable,b[2][2].lock),e[f[0]]=function(){return e[f[0]+"With"](this===e?d:this,arguments),this},e[f[0]+"With"]=g.fireWith}),d.promise(e),a&&a.call(e,e),e},when:function(a){var b=0,c=e.call(arguments),d=c.length,f=1!==d||a&&n.isFunction(a.promise)?d:0,g=1===f?a:n.Deferred(),h=function(a,b,c){return function(d){b[a]=this,c[a]=arguments.length>1?e.call(arguments):d,c===i?g.notifyWith(b,c):--f||g.resolveWith(b,c)}},i,j,k;if(d>1)for(i=new Array(d),j=new Array(d),k=new Array(d);d>b;b++)c[b]&&n.isFunction(c[b].promise)?c[b].promise().progress(h(b,j,i)).done(h(b,k,c)).fail(g.reject):--f;return f||g.resolveWith(k,c),g.promise()}});var I;n.fn.ready=function(a){return n.ready.promise().done(a),this},n.extend({isReady:!1,readyWait:1,holdReady:function(a){a?n.readyWait++:n.ready(!0)},ready:function(a){(a===!0?--n.readyWait:n.isReady)||(n.isReady=!0,a!==!0&&--n.readyWait>0||(I.resolveWith(d,[n]),n.fn.triggerHandler&&(n(d).triggerHandler("ready"),n(d).off("ready"))))}});function J(){d.removeEventListener("DOMContentLoaded",J),a.removeEventListener("load",J),n.ready()}n.ready.promise=function(b){return I||(I=n.Deferred(),"complete"===d.readyState||"loading"!==d.readyState&&!d.documentElement.doScroll?a.setTimeout(n.ready):(d.addEventListener("DOMContentLoaded",J),a.addEventListener("load",J))),I.promise(b)},n.ready.promise();var K=function(a,b,c,d,e,f,g){var h=0,i=a.length,j=null==c;if("object"===n.type(c)){e=!0;for(h in c)K(a,b,h,c[h],!0,f,g)}else if(void 0!==d&&(e=!0,n.isFunction(d)||(g=!0),j&&(g?(b.call(a,d),b=null):(j=b,b=function(a,b,c){return j.call(n(a),c)})),b))for(;i>h;h++)b(a[h],c,g?d:d.call(a[h],h,b(a[h],c)));return e?a:j?b.call(a):i?b(a[0],c):f},L=function(a){return 1===a.nodeType||9===a.nodeType||!+a.nodeType};function M(){this.expando=n.expando+M.uid++}M.uid=1,M.prototype={register:function(a,b){var c=b||{};return a.nodeType?a[this.expando]=c:Object.defineProperty(a,this.expando,{value:c,writable:!0,configurable:!0}),a[this.expando]},cache:function(a){if(!L(a))return{};var b=a[this.expando];return b||(b={},L(a)&&(a.nodeType?a[this.expando]=b:Object.defineProperty(a,this.expando,{value:b,configurable:!0}))),b},set:function(a,b,c){var d,e=this.cache(a);if("string"==typeof b)e[b]=c;else for(d in b)e[d]=b[d];return e},get:function(a,b){return void 0===b?this.cache(a):a[this.expando]&&a[this.expando][b]},access:function(a,b,c){var d;return void 0===b||b&&"string"==typeof b&&void 0===c?(d=this.get(a,b),void 0!==d?d:this.get(a,n.camelCase(b))):(this.set(a,b,c),void 0!==c?c:b)},remove:function(a,b){var c,d,e,f=a[this.expando];if(void 0!==f){if(void 0===b)this.register(a);else{n.isArray(b)?d=b.concat(b.map(n.camelCase)):(e=n.camelCase(b),b in f?d=[b,e]:(d=e,d=d in f?[d]:d.match(G)||[])),c=d.length;while(c--)delete f[d[c]]}(void 0===b||n.isEmptyObject(f))&&(a.nodeType?a[this.expando]=void 0:delete a[this.expando])}},hasData:function(a){var b=a[this.expando];return void 0!==b&&!n.isEmptyObject(b)}};var N=new M,O=new M,P=/^(?:\{[\w\W]*\}|\[[\w\W]*\])$/,Q=/[A-Z]/g;function R(a,b,c){var d;if(void 0===c&&1===a.nodeType)if(d="data-"+b.replace(Q,"-$&").toLowerCase(),c=a.getAttribute(d),"string"==typeof c){try{c="true"===c?!0:"false"===c?!1:"null"===c?null:+c+""===c?+c:P.test(c)?n.parseJSON(c):c; +}catch(e){}O.set(a,b,c)}else c=void 0;return c}n.extend({hasData:function(a){return O.hasData(a)||N.hasData(a)},data:function(a,b,c){return O.access(a,b,c)},removeData:function(a,b){O.remove(a,b)},_data:function(a,b,c){return N.access(a,b,c)},_removeData:function(a,b){N.remove(a,b)}}),n.fn.extend({data:function(a,b){var c,d,e,f=this[0],g=f&&f.attributes;if(void 0===a){if(this.length&&(e=O.get(f),1===f.nodeType&&!N.get(f,"hasDataAttrs"))){c=g.length;while(c--)g[c]&&(d=g[c].name,0===d.indexOf("data-")&&(d=n.camelCase(d.slice(5)),R(f,d,e[d])));N.set(f,"hasDataAttrs",!0)}return e}return"object"==typeof a?this.each(function(){O.set(this,a)}):K(this,function(b){var c,d;if(f&&void 0===b){if(c=O.get(f,a)||O.get(f,a.replace(Q,"-$&").toLowerCase()),void 0!==c)return c;if(d=n.camelCase(a),c=O.get(f,d),void 0!==c)return c;if(c=R(f,d,void 0),void 0!==c)return c}else d=n.camelCase(a),this.each(function(){var c=O.get(this,d);O.set(this,d,b),a.indexOf("-")>-1&&void 0!==c&&O.set(this,a,b)})},null,b,arguments.length>1,null,!0)},removeData:function(a){return this.each(function(){O.remove(this,a)})}}),n.extend({queue:function(a,b,c){var d;return a?(b=(b||"fx")+"queue",d=N.get(a,b),c&&(!d||n.isArray(c)?d=N.access(a,b,n.makeArray(c)):d.push(c)),d||[]):void 0},dequeue:function(a,b){b=b||"fx";var c=n.queue(a,b),d=c.length,e=c.shift(),f=n._queueHooks(a,b),g=function(){n.dequeue(a,b)};"inprogress"===e&&(e=c.shift(),d--),e&&("fx"===b&&c.unshift("inprogress"),delete f.stop,e.call(a,g,f)),!d&&f&&f.empty.fire()},_queueHooks:function(a,b){var c=b+"queueHooks";return N.get(a,c)||N.access(a,c,{empty:n.Callbacks("once memory").add(function(){N.remove(a,[b+"queue",c])})})}}),n.fn.extend({queue:function(a,b){var c=2;return"string"!=typeof a&&(b=a,a="fx",c--),arguments.length",""],thead:[1,"","
    "],col:[2,"","
    "],tr:[2,"","
    "],td:[3,"","
    "],_default:[0,"",""]};$.optgroup=$.option,$.tbody=$.tfoot=$.colgroup=$.caption=$.thead,$.th=$.td;function _(a,b){var c="undefined"!=typeof a.getElementsByTagName?a.getElementsByTagName(b||"*"):"undefined"!=typeof a.querySelectorAll?a.querySelectorAll(b||"*"):[];return void 0===b||b&&n.nodeName(a,b)?n.merge([a],c):c}function aa(a,b){for(var c=0,d=a.length;d>c;c++)N.set(a[c],"globalEval",!b||N.get(b[c],"globalEval"))}var ba=/<|&#?\w+;/;function ca(a,b,c,d,e){for(var f,g,h,i,j,k,l=b.createDocumentFragment(),m=[],o=0,p=a.length;p>o;o++)if(f=a[o],f||0===f)if("object"===n.type(f))n.merge(m,f.nodeType?[f]:f);else if(ba.test(f)){g=g||l.appendChild(b.createElement("div")),h=(Y.exec(f)||["",""])[1].toLowerCase(),i=$[h]||$._default,g.innerHTML=i[1]+n.htmlPrefilter(f)+i[2],k=i[0];while(k--)g=g.lastChild;n.merge(m,g.childNodes),g=l.firstChild,g.textContent=""}else m.push(b.createTextNode(f));l.textContent="",o=0;while(f=m[o++])if(d&&n.inArray(f,d)>-1)e&&e.push(f);else if(j=n.contains(f.ownerDocument,f),g=_(l.appendChild(f),"script"),j&&aa(g),c){k=0;while(f=g[k++])Z.test(f.type||"")&&c.push(f)}return l}!function(){var a=d.createDocumentFragment(),b=a.appendChild(d.createElement("div")),c=d.createElement("input");c.setAttribute("type","radio"),c.setAttribute("checked","checked"),c.setAttribute("name","t"),b.appendChild(c),l.checkClone=b.cloneNode(!0).cloneNode(!0).lastChild.checked,b.innerHTML="",l.noCloneChecked=!!b.cloneNode(!0).lastChild.defaultValue}();var da=/^key/,ea=/^(?:mouse|pointer|contextmenu|drag|drop)|click/,fa=/^([^.]*)(?:\.(.+)|)/;function ga(){return!0}function ha(){return!1}function ia(){try{return d.activeElement}catch(a){}}function ja(a,b,c,d,e,f){var g,h;if("object"==typeof b){"string"!=typeof c&&(d=d||c,c=void 0);for(h in b)ja(a,h,c,d,b[h],f);return a}if(null==d&&null==e?(e=c,d=c=void 0):null==e&&("string"==typeof c?(e=d,d=void 0):(e=d,d=c,c=void 0)),e===!1)e=ha;else if(!e)return a;return 1===f&&(g=e,e=function(a){return n().off(a),g.apply(this,arguments)},e.guid=g.guid||(g.guid=n.guid++)),a.each(function(){n.event.add(this,b,e,d,c)})}n.event={global:{},add:function(a,b,c,d,e){var f,g,h,i,j,k,l,m,o,p,q,r=N.get(a);if(r){c.handler&&(f=c,c=f.handler,e=f.selector),c.guid||(c.guid=n.guid++),(i=r.events)||(i=r.events={}),(g=r.handle)||(g=r.handle=function(b){return"undefined"!=typeof n&&n.event.triggered!==b.type?n.event.dispatch.apply(a,arguments):void 0}),b=(b||"").match(G)||[""],j=b.length;while(j--)h=fa.exec(b[j])||[],o=q=h[1],p=(h[2]||"").split(".").sort(),o&&(l=n.event.special[o]||{},o=(e?l.delegateType:l.bindType)||o,l=n.event.special[o]||{},k=n.extend({type:o,origType:q,data:d,handler:c,guid:c.guid,selector:e,needsContext:e&&n.expr.match.needsContext.test(e),namespace:p.join(".")},f),(m=i[o])||(m=i[o]=[],m.delegateCount=0,l.setup&&l.setup.call(a,d,p,g)!==!1||a.addEventListener&&a.addEventListener(o,g)),l.add&&(l.add.call(a,k),k.handler.guid||(k.handler.guid=c.guid)),e?m.splice(m.delegateCount++,0,k):m.push(k),n.event.global[o]=!0)}},remove:function(a,b,c,d,e){var f,g,h,i,j,k,l,m,o,p,q,r=N.hasData(a)&&N.get(a);if(r&&(i=r.events)){b=(b||"").match(G)||[""],j=b.length;while(j--)if(h=fa.exec(b[j])||[],o=q=h[1],p=(h[2]||"").split(".").sort(),o){l=n.event.special[o]||{},o=(d?l.delegateType:l.bindType)||o,m=i[o]||[],h=h[2]&&new RegExp("(^|\\.)"+p.join("\\.(?:.*\\.|)")+"(\\.|$)"),g=f=m.length;while(f--)k=m[f],!e&&q!==k.origType||c&&c.guid!==k.guid||h&&!h.test(k.namespace)||d&&d!==k.selector&&("**"!==d||!k.selector)||(m.splice(f,1),k.selector&&m.delegateCount--,l.remove&&l.remove.call(a,k));g&&!m.length&&(l.teardown&&l.teardown.call(a,p,r.handle)!==!1||n.removeEvent(a,o,r.handle),delete i[o])}else for(o in i)n.event.remove(a,o+b[j],c,d,!0);n.isEmptyObject(i)&&N.remove(a,"handle events")}},dispatch:function(a){a=n.event.fix(a);var b,c,d,f,g,h=[],i=e.call(arguments),j=(N.get(this,"events")||{})[a.type]||[],k=n.event.special[a.type]||{};if(i[0]=a,a.delegateTarget=this,!k.preDispatch||k.preDispatch.call(this,a)!==!1){h=n.event.handlers.call(this,a,j),b=0;while((f=h[b++])&&!a.isPropagationStopped()){a.currentTarget=f.elem,c=0;while((g=f.handlers[c++])&&!a.isImmediatePropagationStopped())a.rnamespace&&!a.rnamespace.test(g.namespace)||(a.handleObj=g,a.data=g.data,d=((n.event.special[g.origType]||{}).handle||g.handler).apply(f.elem,i),void 0!==d&&(a.result=d)===!1&&(a.preventDefault(),a.stopPropagation()))}return k.postDispatch&&k.postDispatch.call(this,a),a.result}},handlers:function(a,b){var c,d,e,f,g=[],h=b.delegateCount,i=a.target;if(h&&i.nodeType&&("click"!==a.type||isNaN(a.button)||a.button<1))for(;i!==this;i=i.parentNode||this)if(1===i.nodeType&&(i.disabled!==!0||"click"!==a.type)){for(d=[],c=0;h>c;c++)f=b[c],e=f.selector+" ",void 0===d[e]&&(d[e]=f.needsContext?n(e,this).index(i)>-1:n.find(e,this,null,[i]).length),d[e]&&d.push(f);d.length&&g.push({elem:i,handlers:d})}return h]*)\/>/gi,la=/\s*$/g;function pa(a,b){return n.nodeName(a,"table")&&n.nodeName(11!==b.nodeType?b:b.firstChild,"tr")?a.getElementsByTagName("tbody")[0]||a.appendChild(a.ownerDocument.createElement("tbody")):a}function qa(a){return a.type=(null!==a.getAttribute("type"))+"/"+a.type,a}function ra(a){var b=na.exec(a.type);return b?a.type=b[1]:a.removeAttribute("type"),a}function sa(a,b){var c,d,e,f,g,h,i,j;if(1===b.nodeType){if(N.hasData(a)&&(f=N.access(a),g=N.set(b,f),j=f.events)){delete g.handle,g.events={};for(e in j)for(c=0,d=j[e].length;d>c;c++)n.event.add(b,e,j[e][c])}O.hasData(a)&&(h=O.access(a),i=n.extend({},h),O.set(b,i))}}function ta(a,b){var c=b.nodeName.toLowerCase();"input"===c&&X.test(a.type)?b.checked=a.checked:"input"!==c&&"textarea"!==c||(b.defaultValue=a.defaultValue)}function ua(a,b,c,d){b=f.apply([],b);var e,g,h,i,j,k,m=0,o=a.length,p=o-1,q=b[0],r=n.isFunction(q);if(r||o>1&&"string"==typeof q&&!l.checkClone&&ma.test(q))return a.each(function(e){var f=a.eq(e);r&&(b[0]=q.call(this,e,f.html())),ua(f,b,c,d)});if(o&&(e=ca(b,a[0].ownerDocument,!1,a,d),g=e.firstChild,1===e.childNodes.length&&(e=g),g||d)){for(h=n.map(_(e,"script"),qa),i=h.length;o>m;m++)j=e,m!==p&&(j=n.clone(j,!0,!0),i&&n.merge(h,_(j,"script"))),c.call(a[m],j,m);if(i)for(k=h[h.length-1].ownerDocument,n.map(h,ra),m=0;i>m;m++)j=h[m],Z.test(j.type||"")&&!N.access(j,"globalEval")&&n.contains(k,j)&&(j.src?n._evalUrl&&n._evalUrl(j.src):n.globalEval(j.textContent.replace(oa,"")))}return a}function va(a,b,c){for(var d,e=b?n.filter(b,a):a,f=0;null!=(d=e[f]);f++)c||1!==d.nodeType||n.cleanData(_(d)),d.parentNode&&(c&&n.contains(d.ownerDocument,d)&&aa(_(d,"script")),d.parentNode.removeChild(d));return a}n.extend({htmlPrefilter:function(a){return a.replace(ka,"<$1>")},clone:function(a,b,c){var d,e,f,g,h=a.cloneNode(!0),i=n.contains(a.ownerDocument,a);if(!(l.noCloneChecked||1!==a.nodeType&&11!==a.nodeType||n.isXMLDoc(a)))for(g=_(h),f=_(a),d=0,e=f.length;e>d;d++)ta(f[d],g[d]);if(b)if(c)for(f=f||_(a),g=g||_(h),d=0,e=f.length;e>d;d++)sa(f[d],g[d]);else sa(a,h);return g=_(h,"script"),g.length>0&&aa(g,!i&&_(a,"script")),h},cleanData:function(a){for(var b,c,d,e=n.event.special,f=0;void 0!==(c=a[f]);f++)if(L(c)){if(b=c[N.expando]){if(b.events)for(d in b.events)e[d]?n.event.remove(c,d):n.removeEvent(c,d,b.handle);c[N.expando]=void 0}c[O.expando]&&(c[O.expando]=void 0)}}}),n.fn.extend({domManip:ua,detach:function(a){return va(this,a,!0)},remove:function(a){return va(this,a)},text:function(a){return K(this,function(a){return void 0===a?n.text(this):this.empty().each(function(){1!==this.nodeType&&11!==this.nodeType&&9!==this.nodeType||(this.textContent=a)})},null,a,arguments.length)},append:function(){return ua(this,arguments,function(a){if(1===this.nodeType||11===this.nodeType||9===this.nodeType){var b=pa(this,a);b.appendChild(a)}})},prepend:function(){return ua(this,arguments,function(a){if(1===this.nodeType||11===this.nodeType||9===this.nodeType){var b=pa(this,a);b.insertBefore(a,b.firstChild)}})},before:function(){return ua(this,arguments,function(a){this.parentNode&&this.parentNode.insertBefore(a,this)})},after:function(){return ua(this,arguments,function(a){this.parentNode&&this.parentNode.insertBefore(a,this.nextSibling)})},empty:function(){for(var a,b=0;null!=(a=this[b]);b++)1===a.nodeType&&(n.cleanData(_(a,!1)),a.textContent="");return this},clone:function(a,b){return a=null==a?!1:a,b=null==b?a:b,this.map(function(){return n.clone(this,a,b)})},html:function(a){return K(this,function(a){var b=this[0]||{},c=0,d=this.length;if(void 0===a&&1===b.nodeType)return b.innerHTML;if("string"==typeof a&&!la.test(a)&&!$[(Y.exec(a)||["",""])[1].toLowerCase()]){a=n.htmlPrefilter(a);try{for(;d>c;c++)b=this[c]||{},1===b.nodeType&&(n.cleanData(_(b,!1)),b.innerHTML=a);b=0}catch(e){}}b&&this.empty().append(a)},null,a,arguments.length)},replaceWith:function(){var a=[];return ua(this,arguments,function(b){var c=this.parentNode;n.inArray(this,a)<0&&(n.cleanData(_(this)),c&&c.replaceChild(b,this))},a)}}),n.each({appendTo:"append",prependTo:"prepend",insertBefore:"before",insertAfter:"after",replaceAll:"replaceWith"},function(a,b){n.fn[a]=function(a){for(var c,d=[],e=n(a),f=e.length-1,h=0;f>=h;h++)c=h===f?this:this.clone(!0),n(e[h])[b](c),g.apply(d,c.get());return this.pushStack(d)}});var wa,xa={HTML:"block",BODY:"block"};function ya(a,b){var c=n(b.createElement(a)).appendTo(b.body),d=n.css(c[0],"display");return c.detach(),d}function za(a){var b=d,c=xa[a];return c||(c=ya(a,b),"none"!==c&&c||(wa=(wa||n("',srcAction:"iframe_src",patterns:{youtube:{index:"youtube.com",id:"v=",src:"//www.youtube.com/embed/%id%?autoplay=1"},vimeo:{index:"vimeo.com/",id:"/",src:"//player.vimeo.com/video/%id%?autoplay=1"},gmaps:{index:"//maps.google.",src:"%id%&output=embed"}}},proto:{initIframe:function(){n.types.push(P),w("BeforeChange",function(a,b,c){b!==c&&(b===P?R():c===P&&R(!0))}),w(b+"."+P,function(){R()})},getIframe:function(b,c){var d=b.src,e=n.st.iframe;a.each(e.patterns,function(){if(d.indexOf(this.index)>-1)return this.id&&(typeof this.id=="string"?d=d.substr(d.lastIndexOf(this.id)+this.id.length,d.length):d=this.id.call(this,d)),d=this.src.replace("%id%",d),!1});var f={};return e.srcAction&&(f[e.srcAction]=d),n._parseMarkup(c,f,b),n.updateStatus("ready"),c}}});var S=function(a){var b=n.items.length;return a>b-1?a-b:a<0?b+a:a},T=function(a,b,c){return a.replace(/%curr%/gi,b+1).replace(/%total%/gi,c)};a.magnificPopup.registerModule("gallery",{options:{enabled:!1,arrowMarkup:'',preload:[0,2],navigateByImgClick:!0,arrows:!0,tPrev:"Previous (Left arrow key)",tNext:"Next (Right arrow key)",tCounter:"%curr% of %total%"},proto:{initGallery:function(){var c=n.st.gallery,d=".mfp-gallery";n.direction=!0;if(!c||!c.enabled)return!1;u+=" mfp-gallery",w(g+d,function(){c.navigateByImgClick&&n.wrap.on("click"+d,".mfp-img",function(){if(n.items.length>1)return n.next(),!1}),s.on("keydown"+d,function(a){a.keyCode===37?n.prev():a.keyCode===39&&n.next()})}),w("UpdateStatus"+d,function(a,b){b.text&&(b.text=T(b.text,n.currItem.index,n.items.length))}),w(f+d,function(a,b,d,e){var f=n.items.length;d.counter=f>1?T(c.tCounter,e.index,f):""}),w("BuildControls"+d,function(){if(n.items.length>1&&c.arrows&&!n.arrowLeft){var b=c.arrowMarkup,d=n.arrowLeft=a(b.replace(/%title%/gi,c.tPrev).replace(/%dir%/gi,"left")).addClass(m),e=n.arrowRight=a(b.replace(/%title%/gi,c.tNext).replace(/%dir%/gi,"right")).addClass(m);d.click(function(){n.prev()}),e.click(function(){n.next()}),n.container.append(d.add(e))}}),w(h+d,function(){n._preloadTimeout&&clearTimeout(n._preloadTimeout),n._preloadTimeout=setTimeout(function(){n.preloadNearbyImages(),n._preloadTimeout=null},16)}),w(b+d,function(){s.off(d),n.wrap.off("click"+d),n.arrowRight=n.arrowLeft=null})},next:function(){n.direction=!0,n.index=S(n.index+1),n.updateItemHTML()},prev:function(){n.direction=!1,n.index=S(n.index-1),n.updateItemHTML()},goTo:function(a){n.direction=a>=n.index,n.index=a,n.updateItemHTML()},preloadNearbyImages:function(){var a=n.st.gallery.preload,b=Math.min(a[0],n.items.length),c=Math.min(a[1],n.items.length),d;for(d=1;d<=(n.direction?c:b);d++)n._preloadItem(n.index+d);for(d=1;d<=(n.direction?b:c);d++)n._preloadItem(n.index-d)},_preloadItem:function(b){b=S(b);if(n.items[b].preloaded)return;var c=n.items[b];c.parsed||(c=n.parseEl(b)),y("LazyLoad",c),c.type==="image"&&(c.img=a('').on("load.mfploader",function(){c.hasSize=!0}).on("error.mfploader",function(){c.hasSize=!0,c.loadError=!0,y("LazyLoadError",c)}).attr("src",c.src)),c.preloaded=!0}}});var U="retina";a.magnificPopup.registerModule(U,{options:{replaceSrc:function(a){return a.src.replace(/\.\w+$/,function(a){return"@2x"+a})},ratio:1},proto:{initRetina:function(){if(window.devicePixelRatio>1){var a=n.st.retina,b=a.ratio;b=isNaN(b)?b():b,b>1&&(w("ImageHasSize."+U,function(a,c){c.img.css({"max-width":c.img[0].naturalWidth/b,width:"100%"})}),w("ElementParse."+U,function(c,d){d.src=a.replaceSrc(d,b)}))}}}}),A()}) diff --git a/_site/assets/js/src/scripts.js b/_site/assets/js/src/scripts.js new file mode 100644 index 000000000..bb7148626 --- /dev/null +++ b/_site/assets/js/src/scripts.js @@ -0,0 +1,34 @@ +// Add lightbox class to all image links +$("a[href$='.jpg'],a[href$='.jpeg'],a[href$='.JPG'],a[href$='.png'],a[href$='.gif']").addClass("image-popup"); + +// FitVids options +$(function() { + $(".content").fitVids(); +}); + +// Projects Menu +$('.projects-menu-icon').click(function() { + $('html').toggleClass('no-scroll'); + $(this).toggleClass('active'); + $('.overlay').toggleClass('show'); +}); + +// All others +$(document).ready(function() { + $('.image-popup').magnificPopup({ + type: 'image', + tLoading: 'Loading image #%curr%...', + gallery: { + enabled: true, + navigateByImgClick: true, + preload: [0,1] // Will preload 0 - before current, and 1 after the current image + }, + image: { + tError: 'Image #%curr% could not be loaded.', + }, + removalDelay: 300, // Delay in milliseconds before popup is removed + // Class that is added to body when popup is open. + // make it unique to apply your CSS animations just to this exact popup + mainClass: 'mfp-fade' + }); +}); diff --git a/_site/favicon.ico b/_site/favicon.ico new file mode 100644 index 000000000..6b35be04c Binary files /dev/null and b/_site/favicon.ico differ diff --git a/_site/favicon.png b/_site/favicon.png new file mode 100644 index 000000000..03c939ed2 Binary files /dev/null and b/_site/favicon.png differ diff --git a/_site/feed.xml b/_site/feed.xml new file mode 100644 index 000000000..b4462b343 --- /dev/null +++ b/_site/feed.xml @@ -0,0 +1,494 @@ +Jekyll2019-08-09T13:44:29+09:00https://inaheaven.github.io/Home-Org2/feed.xmlInaheavenPersonal PortfolioPixels to Animation2019-07-04T00:00:00+09:002019-07-04T00:00:00+09:00https://inaheaven.github.io/Home-Org2/webapp/2019/07/04/Pixels%20to%20Animation<p>This is a summary of Udacity’s HTML5 Canvas coursework.</p> + +<p>You can find the full course materials here: <a href="https://classroom.udacity.com/courses/ud292">Full Course Page</a></p> + +<h2 id="introduction">Introduction</h2> + +<ul> + <li>Pixels make up the data of a photo.</li> + <li>Every color imaginable can be represented with a combination of red, green and blue.</li> + <li>Depending on the type of image you are storing in the computer, +there is an additional alpha channel that stores how solid or transparent the final color will be.</li> +</ul> + +<hr /> + +<h2 id="filters-and-effects">Filters and effects</h2> + +<ul> + <li>Why edit images in browser? + <ul> + <li>Doing locally edit allows the user to make changes without a full round trip to the server.</li> + </ul> + </li> + <li>Such tasks can be done with/ without external libraries: + <ul> + <li>make an image black and white by averaging the rgb values</li> + <li>invert the colors by assigning the pixels to the compliments of the current values</li> + <li>turn out the lights/ or turn on the night visions</li> + </ul> + </li> +</ul> + +<hr /> + +<h2 id="quiz-canvas-2d-image-data">Quiz: Canvas 2D Image Data</h2> + +<ul> + <li>Image backing a canvas is represented in JS with an Image Data Object.</li> + <li>It contains values for the width, and height of the source image in pixels, along with the data array containing the red, green, blue and alpha values for each pixel.</li> + <li>data property is usually represented by a Uint8Clampled Array. + <ul> + <li>U means that their rate is unsigned or contains only positive values.</li> + <li>Int8 indicates that it will store 8-bit numbers. (8-bit positive numbers from 0 to 255.)</li> + <li>if JS was making it easy, the data for one pixel would be separated from all the others like this.</li> + <li>instead, it is one giant list you have to parse when you apply effects.</li> + <li>we can retrieve or modify the image data by calling one of these functions. + <ul> + <li>createImageData: initializes a blank image data object that you can modify</li> + <li>getImageData: retrieve data to a backing canvas</li> + <li>putImageData: store data to a backing canvas</li> + </ul> + </li> + </ul> + </li> + <li> + <p>Try working with Image Data +1) Create a canvas2d rendering context +2) call get imagedata to retrieve the pixels in the canvas +3) change every 10th pixel to a solid green color +Hint) Colors values range from 0-255</p> + </li> + <li>Canvas2Drendering: <a href="https://codepen.io/inaheaven/pen/wLYaNN">Find the code executions in CodePen</a></li> +</ul> + +<div class="language-html highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="cp">&lt;!DOCTYPE HTML&gt;</span> +<span class="nt">&lt;html&gt;</span> +<span class="nt">&lt;head&gt;&lt;/head&gt;</span> +<span class="nt">&lt;body&gt;</span> + <span class="nt">&lt;canvas</span> <span class="na">id =</span><span class="s">"c"</span> <span class="na">width=</span><span class="s">"400"</span> <span class="na">height=</span><span class="s">"400"</span><span class="nt">&gt;</span> <span class="nt">&lt;/canvas&gt;</span> + <span class="nt">&lt;script&gt;</span> + <span class="kd">var</span> <span class="nx">c</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">querySelector</span><span class="p">(</span><span class="dl">"</span><span class="s2">#c</span><span class="dl">"</span><span class="p">);</span> + <span class="kd">var</span> <span class="nx">ctx</span> <span class="o">=</span> <span class="nx">c</span><span class="p">.</span><span class="nx">getContext</span><span class="p">(</span><span class="dl">"</span><span class="s2">2d</span><span class="dl">"</span><span class="p">);</span> + <span class="nx">data</span> <span class="o">=</span> <span class="nx">ctx</span><span class="p">.</span><span class="nx">getImageData</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span><span class="mi">0</span><span class="p">,</span><span class="mi">400</span><span class="p">,</span><span class="mi">400</span><span class="p">);</span> + + <span class="kd">function</span> <span class="nx">paintGreen</span><span class="p">(</span><span class="nx">imageData</span><span class="p">)</span> <span class="p">{</span> + <span class="kd">var</span> <span class="nx">numPixels</span> <span class="o">=</span> <span class="nx">imageData</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">length</span><span class="o">/</span><span class="mi">4</span><span class="p">;</span> + <span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span><span class="o">=</span><span class="mi">0</span><span class="p">;</span> <span class="nx">i</span><span class="o">&lt;</span><span class="nx">numPixels</span><span class="p">;</span> <span class="nx">i</span><span class="o">++</span><span class="p">)</span> <span class="p">{</span> + <span class="k">if</span><span class="p">(</span><span class="nx">i</span><span class="o">%</span><span class="mi">10</span> <span class="o">==</span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span> + <span class="nx">imageData</span><span class="p">.</span><span class="nx">data</span><span class="p">[</span><span class="nx">i</span><span class="o">*</span><span class="mi">4</span><span class="o">+</span><span class="mi">1</span><span class="p">]</span> <span class="o">=</span> <span class="mi">255</span><span class="p">;</span> + <span class="c1">//set alpha values as well</span> + <span class="nx">imageData</span><span class="p">.</span><span class="nx">data</span><span class="p">[</span><span class="nx">i</span><span class="o">*</span><span class="mi">4</span><span class="o">+</span><span class="mi">3</span><span class="p">]</span> <span class="o">=</span> <span class="mi">255</span><span class="p">;</span> + <span class="p">}</span> + <span class="p">}</span> + <span class="nx">ctx</span><span class="p">.</span><span class="nx">putImageData</span><span class="p">(</span><span class="nx">imageData</span><span class="p">,</span><span class="mi">0</span><span class="p">,</span><span class="mi">0</span><span class="p">);</span> + <span class="p">}</span> + <span class="nx">paintGreen</span><span class="p">(</span><span class="nx">data</span><span class="p">);</span> + <span class="nt">&lt;/script&gt;</span> +<span class="nt">&lt;/body&gt;</span> +<span class="nt">&lt;/html&gt;</span> +</code></pre></div></div> + +<hr /> + +<h2 id="playing-video-in-canvas">Playing Video in Canvas</h2> + +<ul> + <li>Quiz + <ul> + <li>What will this code do? + <div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="kd">var</span> <span class="nx">draw</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span> +<span class="nx">canvas</span><span class="p">.</span><span class="nx">getContext</span><span class="p">(</span><span class="dl">"</span><span class="s2">2d</span><span class="dl">"</span><span class="p">).</span><span class="nx">drawImage</span><span class="p">(</span><span class="nx">v</span><span class="p">,</span> <span class="mi">0</span><span class="p">,</span> <span class="mi">0</span><span class="p">);</span> +<span class="p">}</span> +<span class="nx">v</span><span class="p">.</span><span class="nx">addEventListener</span><span class="p">(</span><span class="dl">'</span><span class="s1">play</span><span class="dl">'</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span> +<span class="k">if</span> <span class="p">(</span><span class="nx">v</span><span class="p">.</span><span class="nx">paused</span> <span class="o">||</span> <span class="nx">v</span><span class="p">.</span><span class="nx">ended</span><span class="p">)</span> <span class="k">return</span><span class="p">;</span> +<span class="nx">draw</span><span class="p">();</span> +<span class="p">});</span> +</code></pre></div> </div> + </li> + <li>shows the video in sync with the source video</li> + <li>shows a single frame of the video</li> + </ul> + + <p>** Find the Answer Below of the Page.</p> + </li> +</ul> + +<hr /> + +<h2 id="answers-for-the-quiz">Answers for the Quiz</h2> +<ul> + <li>Playing Video in Canvas + <ul> + <li>Shows a single frame of the video</li> + </ul> + </li> +</ul> + +<hr /> + +<h5 id="please-be-aware-that-this-is-a-summary-of-the-udacity-course-html5-canvas-basics-you-can-find-the-course-here-full-course-page">Please be aware that this is a summary of the Udacity Course HTML5 Canvas Basics. You can find the course here: <a href="https://classroom.udacity.com/courses/ud292">Full Course Page</a>.</h5> +<h5 id="in-here-i-attached-some-image-clips-from-the-lecture-vids-and-free-images-in-codepen-are-from-unsplashcom-taken-by-muzammil-soorma-if-you-find-a-bug-or-have-any-problems-copyrights-of-the-codes-images-quotes-or-any-please-contact-me-at-my-email-in-the-cover-page">In here, I attached some image clips from the lecture vids and free images in CodePen are from unsplash.com, taken by Muzammil Soorma. If you find a bug or have any problems (copyrights of the codes, images, quotes or any), please contact me at my email in the cover page.</h5>Pixels to Animation - Learn to draw graphics on the fly using Javascript and the HTML5 Canvas APIHTML5 Canvas Basics2019-07-03T00:00:00+09:002019-07-03T00:00:00+09:00https://inaheaven.github.io/Home-Org2/webapp/2019/07/03/HTML5%20Canvas%20Basics<p>This is a summary of Udacity’s HTML5 Canvas coursework.</p> + +<p>You can find the full course materials here: <a href="https://classroom.udacity.com/courses/ud292">Full Course Page</a></p> + +<h2 id="introduction">Introduction</h2> +<ul> + <li>Canvas - powerful API which you can use to edit, resize, and otherwise change images, animations, and interactions.</li> + <li>By using the canvas tag, can create a canvas and web page</li> + <li>Canvas is a <code class="highlighter-rouge">2D surface</code> that takes intructions and immediately renders them.</li> + <li>Canvas has a set of functions that allow us to <strong>draw shapes, images, text, and patterns</strong>.</li> +</ul> + +<hr /> + +<h2 id="creating-a-canvas">Creating a Canvas</h2> + +<div class="language-html highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="cp">&lt;!DOCTYPE HTML&gt;</span> +<span class="nt">&lt;html&gt;</span> +<span class="nt">&lt;head&gt;&lt;/head&gt;</span> +<span class="nt">&lt;body&gt;</span> + <span class="nt">&lt;canvas</span> <span class="na">id =</span><span class="s">"c"</span> <span class="na">width=</span><span class="s">"200"</span> <span class="na">height=</span><span class="s">"200"</span><span class="nt">&gt;</span> <span class="nt">&lt;/canvas&gt;</span> + <span class="nt">&lt;script&gt;</span> + <span class="kd">var</span> <span class="nx">c</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">querySelector</span><span class="p">(</span><span class="dl">"</span><span class="s2">#c</span><span class="dl">"</span><span class="p">);</span> + <span class="kd">var</span> <span class="nx">ctx</span> <span class="o">=</span> <span class="nx">c</span><span class="p">.</span><span class="nx">getContext</span><span class="p">(</span><span class="dl">"</span><span class="s2">2d</span><span class="dl">"</span><span class="p">);</span> + <span class="nt">&lt;/script&gt;</span> +<span class="nt">&lt;/body&gt;</span> +<span class="nt">&lt;/html&gt;</span> +</code></pre></div></div> + +<ul> + <li>The canvas tag takes optional width and height parameters to allocate some space on the web page.</li> + <li>But that will only give the physical space on the website to work with.</li> + <li>To use a canvas, access it from the JS code. + <ul> + <li>Grab the canvas using the selector to get the can vas with the id of <code class="highlighter-rouge">c</code> from the body.</li> + <li>Grab the context, call the method, <code class="highlighter-rouge">getContext</code>, on the canvas that we have created, and pass in this parameter for 2d.</li> + </ul> + </li> +</ul> + +<hr /> + +<h2 id="coordinate-system---quiz">Coordinate System - Quiz</h2> + +<p>Unlike the ‘usual’ coordinates from geometric perspectives, +coordinate system in canvas starts from the top-left corner and gets bigger if go right (x-axis), or if go down (y-axis).</p> + +<p><img src="https://inaheaven.github.io/Home-Org2/images/blog/HTML5 Canvas Basics1.png" alt="Coordinate System in Canvas" /></p> + +<h4 id="question">Question</h4> +<p><img src="https://inaheaven.github.io/Home-Org2/images/blog/HTML5 Canvas Basics2.png" alt="Coordinate System in Canvas - Quiz" /></p> + +<hr /> + +<h2 id="loading-images-code">Loading Images Code</h2> +<div class="language-html highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="cp">&lt;!DOCTYPE HTML&gt;</span> +<span class="nt">&lt;html&gt;</span> +<span class="nt">&lt;head&gt;&lt;/head&gt;</span> +<span class="nt">&lt;body&gt;</span> + <span class="nt">&lt;canvas</span> <span class="na">id =</span><span class="s">"c"</span> <span class="na">width=</span><span class="s">"200"</span> <span class="na">height=</span><span class="s">"200"</span><span class="nt">&gt;</span> <span class="nt">&lt;/canvas&gt;</span> + <span class="nt">&lt;script&gt;</span> + <span class="kd">var</span> <span class="nx">c</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">querySelector</span><span class="p">(</span><span class="dl">"</span><span class="s2">#c</span><span class="dl">"</span><span class="p">);</span> + <span class="kd">var</span> <span class="nx">ctx</span> <span class="o">=</span> <span class="nx">c</span><span class="p">.</span><span class="nx">getContext</span><span class="p">(</span><span class="dl">"</span><span class="s2">2d</span><span class="dl">"</span><span class="p">);</span> + + <span class="kd">var</span> <span class="nx">image</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Image</span><span class="p">();</span> + + <span class="nx">image</span><span class="p">.</span><span class="nx">onload</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span> + <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="dl">"</span><span class="s2">Loaded Image</span><span class="dl">"</span><span class="p">);</span> + <span class="c1">// doSomethingElse();</span> + <span class="nx">ctx</span><span class="p">.</span><span class="nx">drawImage</span><span class="p">(</span><span class="nx">image</span><span class="p">,</span> <span class="mi">0</span><span class="p">,</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">c</span><span class="p">.</span><span class="nx">width</span><span class="p">,</span> <span class="nx">c</span><span class="p">.</span><span class="nx">height</span><span class="p">);</span> + <span class="p">}</span> + + <span class="nx">image</span><span class="p">.</span><span class="nx">src</span> <span class="o">=</span> <span class="dl">"</span><span class="s2">some_random_image.png</span><span class="dl">"</span><span class="p">;</span> + <span class="nt">&lt;/script&gt;</span> +<span class="nt">&lt;/body&gt;</span> +<span class="nt">&lt;/html&gt;</span> +</code></pre></div></div> + +<ul> + <li>Use a local file as well as image files on the Internet with URL.</li> + <li>Images in JavaScript get loaded asynchronously, meaning that we need to do work after it is loaded.</li> + <li>For example, in here, grab the context, and call drawImage method on the context of the canvas.</li> + <li>As a param, pass the image itself, starting coordinate x,y, its width and height.</li> + <li>Examples of Loading Images: <a href="https://codepen.io/inaheaven/pen/WqKOrw">Find the code executions in CodePen</a></li> +</ul> + +<div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="kd">var</span> <span class="nx">c</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">querySelector</span><span class="p">(</span><span class="dl">"</span><span class="s2">#c</span><span class="dl">"</span><span class="p">);</span> +<span class="kd">var</span> <span class="nx">ctx</span> <span class="o">=</span> <span class="nx">c</span><span class="p">.</span><span class="nx">getContext</span><span class="p">(</span><span class="dl">"</span><span class="s2">2d</span><span class="dl">"</span><span class="p">);</span> + +<span class="kd">var</span> <span class="nx">image</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Image</span><span class="p">();</span> + +<span class="nx">image</span><span class="p">.</span><span class="nx">onload</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span> + <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="dl">"</span><span class="s2">Loaded Image</span><span class="dl">"</span><span class="p">);</span> + <span class="nx">ctx</span><span class="p">.</span><span class="nx">drawImage</span><span class="p">(</span><span class="nx">image</span><span class="p">,</span> <span class="mi">0</span><span class="p">,</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">c</span><span class="p">.</span><span class="nx">width</span><span class="p">,</span> <span class="nx">c</span><span class="p">.</span><span class="nx">height</span><span class="p">);</span> + + <span class="kd">var</span> <span class="nx">savedImage</span> <span class="o">=</span> <span class="nx">c</span><span class="p">.</span><span class="nx">toDataURL</span><span class="p">();</span> + <span class="nb">window</span><span class="p">.</span><span class="nx">open</span><span class="p">(</span><span class="nx">savedImage</span><span class="p">);</span> + +<span class="p">}</span> +<span class="nx">image</span><span class="p">.</span><span class="nx">src</span> <span class="o">=</span> <span class="dl">"</span><span class="s2">some_random_image.png</span><span class="dl">"</span><span class="p">;</span> +</code></pre></div></div> + +<ul> + <li>Added two lines sho`uld open the image in the new window,</li> + <li>But <code class="highlighter-rouge">Uncaught DOM Exception: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.</code> error occurs.</li> + <li>This is safely hosting and serving image issues.</li> + <li>You can take some detour to save images,but having own server will solve this issues more properly.</li> + <li>The instructor offered: Python SimpleHTTPServer, MAMP, Node to make this work with simple HTTP web server. <a href="https://classroom.udacity.com/courses/ud292/lessons/3163218691/concepts/32309787260923">Detailed instructions can be found here</a></li> +</ul> + +<hr /> + +<h2 id="drawing-rectangles">Drawing Rectangles</h2> + +<div class="language-html highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="cp">&lt;!DOCTYPE HTML&gt;</span> +<span class="nt">&lt;html&gt;</span> +<span class="nt">&lt;head&gt;&lt;/head&gt;</span> +<span class="nt">&lt;body&gt;</span> + <span class="nt">&lt;canvas</span> <span class="na">id =</span><span class="s">"c"</span> <span class="na">width=</span><span class="s">"500"</span> <span class="na">height=</span><span class="s">"500"</span><span class="nt">&gt;</span> <span class="nt">&lt;/canvas&gt;</span> + <span class="nt">&lt;script&gt;</span> + <span class="kd">var</span> <span class="nx">c</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">querySelector</span><span class="p">(</span><span class="dl">"</span><span class="s2">#c</span><span class="dl">"</span><span class="p">);</span> + <span class="kd">var</span> <span class="nx">ctx</span> <span class="o">=</span> <span class="nx">c</span><span class="p">.</span><span class="nx">getContext</span><span class="p">(</span><span class="dl">"</span><span class="s2">2d</span><span class="dl">"</span><span class="p">);</span> + + <span class="nx">ctx</span><span class="p">.</span><span class="nx">fillRect</span><span class="p">(</span><span class="mi">100</span><span class="p">,</span> <span class="mi">100</span><span class="p">,</span> <span class="mi">100</span><span class="p">,</span> <span class="mi">100</span><span class="p">);</span> + <span class="nx">ctx</span><span class="p">.</span><span class="nx">strokeRect</span><span class="p">(</span><span class="mi">50</span><span class="p">,</span> <span class="mi">50</span><span class="p">,</span> <span class="mi">50</span><span class="p">,</span> <span class="mi">50</span><span class="p">);</span> + <span class="nt">&lt;/script&gt;</span> +<span class="nt">&lt;/body&gt;</span> +<span class="nt">&lt;/html&gt;</span> +</code></pre></div></div> + +<ul> + <li>In the code above, called the fillRect, strokeRect.</li> + <li>The params of each function include the position of x,y axis and width and height of the rectangle.</li> + <li>Can use <code class="highlighter-rouge">fillStyle</code>, instead of <code class="highlighter-rouge">fillRect</code> with the color selections.</li> + <li>Also use <code class="highlighter-rouge">clearRect</code> to edit, without modifying the <code class="highlighter-rouge">fillStyle</code></li> + <li>Examples of fillRect, strokeRect: <a href="https://codepen.io/inaheaven/pen/orMeYj">Find the code executions in CodePen</a></li> + <li>Examples of clearRect: <a href="https://codepen.io/inaheaven/pen/YojxeN">Find the code executions in CodePen</a></li> +</ul> + +<hr /> + +<h2 id="paths---quiz">Paths - Quiz</h2> + +<div class="language-html highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="cp">&lt;!DOCTYPE HTML&gt;</span> +<span class="nt">&lt;html&gt;</span> +<span class="nt">&lt;head&gt;&lt;/head&gt;</span> +<span class="nt">&lt;body&gt;</span> + <span class="nt">&lt;canvas</span> <span class="na">id =</span><span class="s">"c"</span> <span class="na">width=</span><span class="s">"500"</span> <span class="na">height=</span><span class="s">"500"</span><span class="nt">&gt;</span> <span class="nt">&lt;/canvas&gt;</span> + <span class="nt">&lt;script&gt;</span> + <span class="kd">var</span> <span class="nx">c</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">querySelector</span><span class="p">(</span><span class="dl">"</span><span class="s2">#c</span><span class="dl">"</span><span class="p">);</span> + <span class="kd">var</span> <span class="nx">ctx</span> <span class="o">=</span> <span class="nx">c</span><span class="p">.</span><span class="nx">getContext</span><span class="p">(</span><span class="dl">"</span><span class="s2">2d</span><span class="dl">"</span><span class="p">);</span> + + <span class="nx">ctx</span><span class="p">.</span><span class="nx">beginPath</span><span class="p">()</span> + <span class="nx">ctx</span><span class="p">.</span><span class="nx">moveTo</span><span class="p">(</span><span class="mi">10</span><span class="p">,</span><span class="mi">10</span><span class="p">);</span> + <span class="nx">ctx</span><span class="p">.</span><span class="nx">lineTo</span><span class="p">(</span><span class="mi">50</span><span class="p">,</span><span class="mi">50</span><span class="p">);</span> + <span class="nx">ctx</span><span class="p">.</span><span class="nx">lineTo</span><span class="p">(</span><span class="mi">50</span><span class="p">,</span><span class="mi">10</span><span class="p">);</span> + <span class="nx">ctx</span><span class="p">.</span><span class="nx">lineTo</span><span class="p">(</span><span class="mi">10</span><span class="p">,</span><span class="mi">10</span><span class="p">);</span> + <span class="nx">ctx</span><span class="p">.</span><span class="nx">fill</span><span class="p">();</span> + <span class="c1">// ctx.stroke();</span> + <span class="nt">&lt;/script&gt;</span> +<span class="nt">&lt;/body&gt;</span> +<span class="nt">&lt;/html&gt;</span> +</code></pre></div></div> + +<ul> + <li>As above, instead of drawing a rectangle right away with fillRect or strokeRect, can draw lines with <code class="highlighter-rouge">lineTo</code>, after moving the pen position by <code class="highlighter-rouge">moveTo</code>;</li> + <li>After, can fill in by <code class="highlighter-rouge">fill</code>, and draw borders only without fill by <code class="highlighter-rouge">stroke</code></li> + <li>Examples of moveTo, lineTo, fill, stroke: <a href="https://codepen.io/inaheaven/pen/LKBowm">Find the code executions in CodePen</a></li> +</ul> + +<hr /> + +<h2 id="moving-objects-in-a-canvas">Moving Objects in a Canvas</h2> + +<ul> + <li>Canvas2D allows to translate (move), rotate, or scale objects.</li> + <li>Examples of scale, translate, rotate: <a href="https://codepen.io/inaheaven/pen/qzyzKL">Find the code executions in CodePen</a></li> +</ul> + +<h4 id="scaling">Scaling</h4> + +<ul> + <li>Use <code class="highlighter-rouge">scale(x,y)</code> mutiplies the x and y values by a given param + <ul> + <li>for example, ctx.scale(2,3) will make all values twice as large on the x axis and three times as larege on the y-axis.</li> + </ul> + </li> +</ul> + +<h4 id="translation">Translation</h4> +<ul> + <li>Use <code class="highlighter-rouge">translate(x,y)</code> moves all subsequent draw commands by x number of pixels on horizontally and y pixels vertically. + <ul> + <li>for example, ctx.translate(20,40); will move all the elements in the context 20 pixels to the right and 40 pixels down.</li> + </ul> + </li> +</ul> + +<h4 id="rotation">Rotation</h4> +<ul> + <li>use <code class="highlighter-rouge">rotate(angleRadians)</code> rotates an object about its center + <ul> + <li>radians = degrees * (MATH.PI/180)</li> + </ul> + </li> +</ul> + +<hr /> + +<h2 id="saving-and-restoring-canvas-state">Saving and Restoring Canvas State</h2> + +<ul> + <li>Every canvas object contains a stack of drawing states. (LIFO structure)</li> + <li>The code below shows the effect of <code class="highlighter-rouge">save</code> and <code class="highlighter-rouge">restore</code>.</li> + <li>Can save some attributes of context as a default with save, and restore the default even after making modifications to the context.</li> + <li>Examples of save, restore: <a href="https://codepen.io/inaheaven/pen/bPjPXq">Find the code executions in CodePen</a></li> +</ul> + +<div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="kd">var</span> <span class="nx">c</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">querySelector</span><span class="p">(</span><span class="dl">"</span><span class="s2">#c</span><span class="dl">"</span><span class="p">);</span> +<span class="kd">var</span> <span class="nx">ctx</span> <span class="o">=</span> <span class="nx">c</span><span class="p">.</span><span class="nx">getContext</span><span class="p">(</span><span class="dl">"</span><span class="s2">2d</span><span class="dl">"</span><span class="p">);</span> + +<span class="nx">ctx</span><span class="p">.</span><span class="nx">fillStyle</span> <span class="o">=</span> <span class="dl">"</span><span class="s2">blue</span><span class="dl">"</span><span class="p">;</span> +<span class="nx">ctx</span><span class="p">.</span><span class="nx">fillRect</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span><span class="mi">0</span><span class="p">,</span><span class="mi">50</span><span class="p">,</span><span class="mi">50</span><span class="p">);</span> + +<span class="c1">// Save state with blue fill</span> +<span class="nx">ctx</span><span class="p">.</span><span class="nx">save</span><span class="p">();</span> +<span class="nx">ctx</span><span class="p">.</span><span class="nx">fillStyle</span> <span class="o">=</span> <span class="dl">"</span><span class="s2">green</span><span class="dl">"</span><span class="p">;</span> +<span class="nx">ctx</span><span class="p">.</span><span class="nx">fillRect</span><span class="p">(</span><span class="mi">100</span><span class="p">,</span><span class="mi">100</span><span class="p">,</span><span class="mi">10</span><span class="p">,</span><span class="mi">10</span><span class="p">);</span> +<span class="c1">// Restore to blue fill</span> +<span class="nx">ctx</span><span class="p">.</span><span class="nx">restore</span><span class="p">();</span> + +<span class="nx">ctx</span><span class="p">.</span><span class="nx">fillRect</span><span class="p">(</span><span class="mi">200</span><span class="p">,</span><span class="mi">10</span><span class="p">,</span><span class="mi">20</span><span class="p">,</span><span class="mi">20</span><span class="p">);</span> +</code></pre></div></div> + +<hr /> + +<h2 id="colors">Colors</h2> + +<ul> + <li>Can add colors to the fill and the stroke by <code class="highlighter-rouge">strokeStyle</code> and <code class="highlighter-rouge">fillStyle</code>.</li> + <li>For the strokes, you have to add color before calling stroke.</li> + <li>Examples of strokeStyle, fillStyle: <a href="https://codepen.io/inaheaven/pen/zVLgKb">Find the code executions in CodePen</a></li> +</ul> + +<div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="kd">var</span> <span class="nx">c</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">querySelector</span><span class="p">(</span><span class="dl">"</span><span class="s2">#c</span><span class="dl">"</span><span class="p">);</span> +<span class="kd">var</span> <span class="nx">ctx</span> <span class="o">=</span> <span class="nx">c</span><span class="p">.</span><span class="nx">getContext</span><span class="p">(</span><span class="dl">"</span><span class="s2">2d</span><span class="dl">"</span><span class="p">);</span> + +<span class="nx">ctx</span><span class="p">.</span><span class="nx">strokeStyle</span> <span class="o">=</span> <span class="dl">"</span><span class="s2">#33CC33</span><span class="dl">"</span><span class="p">;</span> + +<span class="nx">ctx</span><span class="p">.</span><span class="nx">strokeRect</span><span class="p">(</span><span class="mi">50</span><span class="p">,</span> <span class="mi">50</span><span class="p">,</span> <span class="mi">100</span><span class="p">.,</span> <span class="mi">100</span><span class="p">);</span> +<span class="nx">ctx</span><span class="p">.</span><span class="nx">beginPath</span><span class="p">();</span> +<span class="nx">ctx</span><span class="p">.</span><span class="nx">moveTo</span><span class="p">(</span><span class="mi">75</span><span class="p">,</span><span class="mi">75</span><span class="p">);</span> +<span class="nx">ctx</span><span class="p">.</span><span class="nx">lineTo</span><span class="p">(</span><span class="mi">125</span><span class="p">,</span> <span class="mi">125</span><span class="p">);</span> +<span class="nx">ctx</span><span class="p">.</span><span class="nx">lineTo</span><span class="p">(</span><span class="mi">125</span><span class="p">,</span><span class="mi">75</span><span class="p">);</span> + +<span class="nx">ctx</span><span class="p">.</span><span class="nx">fillStyle</span> <span class="o">=</span> <span class="dl">"</span><span class="s2">blue</span><span class="dl">"</span><span class="p">;</span> +<span class="nx">ctx</span><span class="p">.</span><span class="nx">fill</span><span class="p">();</span> +</code></pre></div></div> +<hr /> + +<h2 id="drawing-text">Drawing Text</h2> + +<ul> + <li>Can write text with strokeText in canvas.</li> + <li>When writing a text with strokeText, the lower left corner of the first alphabet is located at (0,0) coordinate. Therefore positioning text at 0,0 will show no result.</li> + <li>Add fonts with <code class="highlighter-rouge">ctx.font = 'size style'</code> + <ul> + <li>for example, ctx.font = ‘40px serif’</li> + </ul> + </li> + <li>Also can some additional styles texts by + <ul> + <li>font = value</li> + <li>textAlign = value</li> + <li>direction = value</li> + </ul> + </li> + <li>More advanced: + <ul> + <li>measureText: returns a <code class="highlighter-rouge">TextMetrics</code> object containing the width, in pixels, that the specified text will be when drawn in the current text style.</li> + <li> + <h2 id="more-information-can-be-found-here-drawing-text-docs">more information can be found here <a href="https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Drawing_text">drawing text docs</a></h2> + </li> + </ul> + </li> +</ul> + +<h2 id="meme-creator">Meme Creator</h2> + +<ul> + <li>Can create memes (text on the image) with the code below.</li> + <li>This is basically the sum of all above description.</li> + <li>Examples of meme creator: <a href="https://codepen.io/inaheaven/pen/vqzYWw">Find the code executions in CodePen</a></li> +</ul> + +<div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="kd">var</span> <span class="nx">c</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">querySelector</span><span class="p">(</span><span class="dl">"</span><span class="s2">#c</span><span class="dl">"</span><span class="p">);</span> +<span class="kd">var</span> <span class="nx">ctx</span> <span class="o">=</span> <span class="nx">c</span><span class="p">.</span><span class="nx">getContext</span><span class="p">(</span><span class="dl">"</span><span class="s2">2d</span><span class="dl">"</span><span class="p">);</span> +<span class="kd">var</span> <span class="nx">image</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Image</span><span class="p">();</span> +<span class="nx">image</span><span class="p">.</span><span class="nx">onload</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(){</span> + <span class="nx">ctx</span><span class="p">.</span><span class="nx">drawImage</span><span class="p">(</span><span class="nx">image</span><span class="p">,</span> <span class="mi">0</span><span class="p">,</span><span class="mi">0</span><span class="p">,</span><span class="nx">c</span><span class="p">.</span><span class="nx">width</span><span class="p">,</span> <span class="nx">c</span><span class="p">.</span><span class="nx">height</span><span class="p">);</span> + <span class="nx">ctx</span><span class="p">.</span><span class="nx">font</span> <span class="o">=</span> <span class="dl">"</span><span class="s2">26pt Impact</span><span class="dl">"</span><span class="p">;</span> + <span class="nx">ctx</span><span class="p">.</span><span class="nx">textAlign</span> <span class="o">=</span> <span class="dl">"</span><span class="s2">center</span><span class="dl">"</span><span class="p">;</span> + <span class="nx">ctx</span><span class="p">.</span><span class="nx">fillStyle</span> <span class="o">=</span> <span class="dl">"</span><span class="s2">white</span><span class="dl">"</span><span class="p">;</span> + <span class="nx">ctx</span><span class="p">.</span><span class="nx">fillText</span><span class="p">(</span><span class="dl">"</span><span class="s2">Hello World</span><span class="dl">"</span><span class="p">,</span> <span class="nx">c</span><span class="p">.</span><span class="nx">width</span><span class="o">/</span><span class="mi">2</span><span class="p">,</span> <span class="mi">50</span><span class="p">);</span> + + <span class="nx">ctx</span><span class="p">.</span><span class="nx">strokeStyle</span> <span class="o">=</span> <span class="dl">"</span><span class="s2">black</span><span class="dl">"</span><span class="p">;</span> + <span class="nx">ctx</span><span class="p">.</span><span class="nx">lineWidth</span> <span class="o">=</span> <span class="mi">3</span><span class="p">;</span> + <span class="nx">ctx</span><span class="p">.</span><span class="nx">strokeText</span><span class="p">(</span><span class="dl">"</span><span class="s2">Canvas Memes</span><span class="dl">"</span><span class="p">,</span> <span class="nx">c</span><span class="p">.</span><span class="nx">width</span><span class="o">/</span><span class="mi">2</span><span class="p">,</span> <span class="nx">c</span><span class="p">.</span><span class="nx">height</span><span class="o">-</span><span class="mi">10</span><span class="p">);</span> +<span class="p">}</span> + +<span class="nx">image</span><span class="p">.</span><span class="nx">src</span> <span class="o">=</span> <span class="dl">"</span><span class="s2">some_random_image.png</span><span class="dl">"</span> +</code></pre></div></div> + +<hr /> + +<h2 id="answers-for-the-quiz">Answers for the Quiz</h2> +<ul> + <li>Coordinate Systems + <ul> + <li><strong>A: (2,1), B: (3,2), C: (1,3)</strong></li> + </ul> + </li> +</ul> + +<hr /> + +<h5 id="please-be-aware-that-this-is-a-summary-of-the-udacity-course-html5-canvas-basics-you-can-find-the-course-here-full-course-page">Please be aware that this is a summary of the Udacity Course HTML5 Canvas Basics. You can find the course here: <a href="https://classroom.udacity.com/courses/ud292">Full Course Page</a>.</h5> +<h5 id="in-here-i-attached-some-image-clips-from-the-lecture-vids-and-free-images-in-codepen-are-from-unsplashcom-taken-by-muzammil-soorma-if-you-find-a-bug-or-have-any-problems-copyrights-of-the-codes-images-quotes-or-any-please-contact-me-at-my-email-in-the-cover-page">In here, I attached some image clips from the lecture vids and free images in CodePen are from unsplash.com, taken by Muzammil Soorma. If you find a bug or have any problems (copyrights of the codes, images, quotes or any), please contact me at my email in the cover page.</h5>HTML5 Canvas Basics - Learn to draw graphics on the fly using Javascript and the HTML5 Canvas APIPage Descriptions2019-07-02T00:00:00+09:002019-07-02T00:00:00+09:00https://inaheaven.github.io/Home-Org2/ml/2019/07/02/Pages<p>Hey,</p> + +<p>I will update some of my works, researches and studies in machine learning,</p> + +<p>and some web-based/ applications works on the separate page.</p> + +<p>Lastly, projects page will include my resume, conducted projects and research results.</p>Hey,Page Descriptions2019-07-02T00:00:00+09:002019-07-02T00:00:00+09:00https://inaheaven.github.io/Home-Org2/webapp/2019/07/02/Pages<p>Hey,</p> + +<p>I will update some of my works, researches and studies in machine learning,</p> + +<p>and some web-based/ applications works on the separate page.</p> + +<p>Lastly, projects page will include my resume, conducted projects and research results.</p>Hey,First Post - Greetings2019-07-01T00:00:00+09:002019-07-01T00:00:00+09:00https://inaheaven.github.io/Home-Org2/ml/2019/07/01/First%20Post%20-%20Greetings<p>Hi all,</p> + +<p>This is my first post of this blog/portfolio page.</p> + +<p>I will update posts as often as possible.</p> + +<p>If you have any questions, find a bug, or just want to say hi,</p> + +<p>feel free to shoot me an email by clicking the email icon on the left side of home.</p> + +<p>(you can go back to home by clicking the top-left icon)</p> + +<p>See you soon.</p>Hi all,First Post - Greetings2019-07-01T00:00:00+09:002019-07-01T00:00:00+09:00https://inaheaven.github.io/Home-Org2/webapp/2019/07/01/First%20Post%20-%20Greetings<p>Hi all,</p> + +<p>This is my first post of this blog/portfolio page.</p> + +<p>I will update posts as often as possible.</p> + +<p>If you have any questions, find a bug, or just want to say hi,</p> + +<p>feel free to shoot me an email by clicking the email icon on the left side of home.</p> + +<p>(you can go back to home by clicking the top-left icon)</p> + +<p>See you soon.</p>Hi all, \ No newline at end of file diff --git a/_site/images/background/background_1.jpeg b/_site/images/background/background_1.jpeg new file mode 100644 index 000000000..c5a9c0e1f Binary files /dev/null and b/_site/images/background/background_1.jpeg differ diff --git a/_site/images/background/background_10.jpeg b/_site/images/background/background_10.jpeg new file mode 100644 index 000000000..85090d0e2 Binary files /dev/null and b/_site/images/background/background_10.jpeg differ diff --git a/_site/images/background/background_11.jpeg b/_site/images/background/background_11.jpeg new file mode 100644 index 000000000..f17ebbbbc Binary files /dev/null and b/_site/images/background/background_11.jpeg differ diff --git a/_site/images/background/background_12.png b/_site/images/background/background_12.png new file mode 100644 index 000000000..217b20fed Binary files /dev/null and b/_site/images/background/background_12.png differ diff --git a/_site/images/background/background_13.jpeg b/_site/images/background/background_13.jpeg new file mode 100644 index 000000000..8dd1bf47f Binary files /dev/null and b/_site/images/background/background_13.jpeg differ diff --git a/_site/images/background/background_14.png b/_site/images/background/background_14.png new file mode 100644 index 000000000..e91f54d11 Binary files /dev/null and b/_site/images/background/background_14.png differ diff --git a/_site/images/background/background_2.jpeg b/_site/images/background/background_2.jpeg new file mode 100644 index 000000000..f5aaf220c Binary files /dev/null and b/_site/images/background/background_2.jpeg differ diff --git a/_site/images/background/background_3.jpeg b/_site/images/background/background_3.jpeg new file mode 100644 index 000000000..5494e4e00 Binary files /dev/null and b/_site/images/background/background_3.jpeg differ diff --git a/_site/images/background/background_4.jpeg b/_site/images/background/background_4.jpeg new file mode 100644 index 000000000..37b180a9d Binary files /dev/null and b/_site/images/background/background_4.jpeg differ diff --git a/_site/images/background/background_5.jpg b/_site/images/background/background_5.jpg new file mode 100644 index 000000000..875c26100 Binary files /dev/null and b/_site/images/background/background_5.jpg differ diff --git a/_site/images/background/background_6.jpeg b/_site/images/background/background_6.jpeg new file mode 100644 index 000000000..65ee985c4 Binary files /dev/null and b/_site/images/background/background_6.jpeg differ diff --git a/_site/images/background/background_7.jpeg b/_site/images/background/background_7.jpeg new file mode 100644 index 000000000..b250c1f93 Binary files /dev/null and b/_site/images/background/background_7.jpeg differ diff --git a/_site/images/background/background_8.jpeg b/_site/images/background/background_8.jpeg new file mode 100644 index 000000000..2db8e5366 Binary files /dev/null and b/_site/images/background/background_8.jpeg differ diff --git a/_site/images/background/background_9.jpeg b/_site/images/background/background_9.jpeg new file mode 100644 index 000000000..fae884e44 Binary files /dev/null and b/_site/images/background/background_9.jpeg differ diff --git a/images/project.jpg b/_site/images/background/project.jpg similarity index 100% rename from images/project.jpg rename to _site/images/background/project.jpg diff --git a/_site/images/blog/HTML5 Canvas Basics1.png b/_site/images/blog/HTML5 Canvas Basics1.png new file mode 100644 index 000000000..b07cc515d Binary files /dev/null and b/_site/images/blog/HTML5 Canvas Basics1.png differ diff --git a/_site/images/blog/HTML5 Canvas Basics2.png b/_site/images/blog/HTML5 Canvas Basics2.png new file mode 100644 index 000000000..adbecec3a Binary files /dev/null and b/_site/images/blog/HTML5 Canvas Basics2.png differ diff --git a/_site/images/blog/default.png b/_site/images/blog/default.png new file mode 100644 index 000000000..e91f54d11 Binary files /dev/null and b/_site/images/blog/default.png differ diff --git a/images/halve-home-image.png b/_site/images/default_images/halve-home-image.png similarity index 100% rename from images/halve-home-image.png rename to _site/images/default_images/halve-home-image.png diff --git a/images/halve-small.png b/_site/images/default_images/halve-small.png similarity index 100% rename from images/halve-small.png rename to _site/images/default_images/halve-small.png diff --git a/images/halve.png b/_site/images/default_images/halve.png similarity index 100% rename from images/halve.png rename to _site/images/default_images/halve.png diff --git a/images/post-image-halve-1.png b/_site/images/default_images/post-image-halve-1.png similarity index 100% rename from images/post-image-halve-1.png rename to _site/images/default_images/post-image-halve-1.png diff --git a/images/post-image-halve-2.png b/_site/images/default_images/post-image-halve-2.png similarity index 100% rename from images/post-image-halve-2.png rename to _site/images/default_images/post-image-halve-2.png diff --git a/images/post-image-halve-3.png b/_site/images/default_images/post-image-halve-3.png similarity index 100% rename from images/post-image-halve-3.png rename to _site/images/default_images/post-image-halve-3.png diff --git a/images/post-image-halve-4.png b/_site/images/default_images/post-image-halve-4.png similarity index 100% rename from images/post-image-halve-4.png rename to _site/images/default_images/post-image-halve-4.png diff --git a/images/post-image-halve-5.png b/_site/images/default_images/post-image-halve-5.png similarity index 100% rename from images/post-image-halve-5.png rename to _site/images/default_images/post-image-halve-5.png diff --git a/images/post-image-halve-6.png b/_site/images/default_images/post-image-halve-6.png similarity index 100% rename from images/post-image-halve-6.png rename to _site/images/default_images/post-image-halve-6.png diff --git a/images/unsplash-gallery-image-3.jpg b/_site/images/default_images/unsplash-gallery-image-3.jpg similarity index 100% rename from images/unsplash-gallery-image-3.jpg rename to _site/images/default_images/unsplash-gallery-image-3.jpg diff --git a/images/unsplash-image-1.jpg b/_site/images/default_images/unsplash-image-1.jpg similarity index 100% rename from images/unsplash-image-1.jpg rename to _site/images/default_images/unsplash-image-1.jpg diff --git a/images/unsplash-image-10.jpg b/_site/images/default_images/unsplash-image-10.jpg similarity index 100% rename from images/unsplash-image-10.jpg rename to _site/images/default_images/unsplash-image-10.jpg diff --git a/images/unsplash-image-4.jpg b/_site/images/default_images/unsplash-image-4.jpg similarity index 100% rename from images/unsplash-image-4.jpg rename to _site/images/default_images/unsplash-image-4.jpg diff --git a/images/unsplash-image-6.jpg b/_site/images/default_images/unsplash-image-6.jpg similarity index 100% rename from images/unsplash-image-6.jpg rename to _site/images/default_images/unsplash-image-6.jpg diff --git a/images/unsplash-image-9.jpg b/_site/images/default_images/unsplash-image-9.jpg similarity index 100% rename from images/unsplash-image-9.jpg rename to _site/images/default_images/unsplash-image-9.jpg diff --git a/_site/images/logo/inaheaven_logo-small.png b/_site/images/logo/inaheaven_logo-small.png new file mode 100644 index 000000000..d4f78e1c0 Binary files /dev/null and b/_site/images/logo/inaheaven_logo-small.png differ diff --git a/_site/images/logo/inaheaven_logo.png b/_site/images/logo/inaheaven_logo.png new file mode 100644 index 000000000..822b74fd9 Binary files /dev/null and b/_site/images/logo/inaheaven_logo.png differ diff --git a/_site/images/logo/site_logo-small.png b/_site/images/logo/site_logo-small.png new file mode 100644 index 000000000..32b893220 Binary files /dev/null and b/_site/images/logo/site_logo-small.png differ diff --git a/_site/images/logo/site_logo.png b/_site/images/logo/site_logo.png new file mode 100644 index 000000000..da051bc9e Binary files /dev/null and b/_site/images/logo/site_logo.png differ diff --git a/_site/images/project/ieee_ecu.png b/_site/images/project/ieee_ecu.png new file mode 100644 index 000000000..4493c3b89 Binary files /dev/null and b/_site/images/project/ieee_ecu.png differ diff --git a/_site/images/project/ingris.png b/_site/images/project/ingris.png new file mode 100644 index 000000000..211a8d4f8 Binary files /dev/null and b/_site/images/project/ingris.png differ diff --git a/_site/images/project/mstudio_admin.png b/_site/images/project/mstudio_admin.png new file mode 100644 index 000000000..431b0f718 Binary files /dev/null and b/_site/images/project/mstudio_admin.png differ diff --git a/_site/index.html b/_site/index.html new file mode 100644 index 000000000..5b34bf0d9 --- /dev/null +++ b/_site/index.html @@ -0,0 +1 @@ + Inaheaven

    Inaheaven

    Personal Portfolio

     MACHINE
    LEARNING     WEB/APP PROJECTS

    About

    Hi All, My name is Sangmin and this is my personal blog and portfolio page. If you have any questions, find a bug, or just want to say hi, feel free to email me by clicking the email icon on the left.


    Many thanks to Vangelis Tzortzis (from vangeltzo.com),
    Christian Fei (https://github.com/christian-fei),
    Sverrir Sigmundarson (https://github.com/sverrirs)
    for sharing this great theme, searching and pagination tools.


    Find the box below to search my posts by Title, Category, Tag(Keyword) or Date.

      diff --git a/_site/ml/2019/07/01/First-Post-Greetings.html b/_site/ml/2019/07/01/First-Post-Greetings.html new file mode 100644 index 000000000..ee9d5f22e --- /dev/null +++ b/_site/ml/2019/07/01/First-Post-Greetings.html @@ -0,0 +1 @@ + First Post - Greetings – Inaheaven
       MACHINE
      LEARNING /

      First Post - Greetings

      Back to Lists /
       MACHINE
      LEARNING       WEB/APP PROJECTS
      01 Jul 2019

      Hi all,

      This is my first post of this blog/portfolio page.

      I will update posts as often as possible.

      If you have any questions, find a bug, or just want to say hi,

      feel free to shoot me an email by clicking the email icon on the left side of home.

      (you can go back to home by clicking the top-left icon)

      See you soon.


      Twitter Facebook Google+
      diff --git a/_site/ml/2019/07/02/Pages.html b/_site/ml/2019/07/02/Pages.html new file mode 100644 index 000000000..a14943821 --- /dev/null +++ b/_site/ml/2019/07/02/Pages.html @@ -0,0 +1 @@ + Page Descriptions – Inaheaven
       MACHINE
      LEARNING /

      Page Descriptions

      Back to Lists /
       MACHINE
      LEARNING       WEB/APP PROJECTS
      02 Jul 2019

      Hey,

      I will update some of my works, researches and studies in machine learning,

      and some web-based/ applications works on the separate page.

      Lastly, projects page will include my resume, conducted projects and research results.


      Twitter Facebook Google+
      diff --git a/_site/ml/index.html b/_site/ml/index.html new file mode 100644 index 000000000..9ec9a422e --- /dev/null +++ b/_site/ml/index.html @@ -0,0 +1 @@ + Machine Learning – Inaheaven

      Machine
      Learning/

       MACHINE
      LEARNING       WEB/APP PROJECTS
      diff --git a/_site/robots.txt b/_site/robots.txt new file mode 100644 index 000000000..f405bea9e --- /dev/null +++ b/_site/robots.txt @@ -0,0 +1 @@ +Sitemap: https://inaheaven.github.io/Home-Org2/sitemap.xml diff --git a/_site/script/cibuild b/_site/script/cibuild new file mode 100644 index 000000000..bd38ba209 --- /dev/null +++ b/_site/script/cibuild @@ -0,0 +1,27 @@ +#!/bin/bash + +# skip if build is triggered by pull request +if [ $TRAVIS_PULL_REQUEST == "true" ]; then + echo "this is PR, exiting" + exit 0 +fi + +# enable error reporting to the console +set -e + +# cleanup "_site" +rm -rf _site +mkdir _site + +# clone remote repo to "_site" +git clone https://${GH_TOKEN}@github.com/inaheaven/Home.git _site +# build with Jekyll into "_site" +bundle exec jekyll build + +# push +cd _site +git config user.email "sangmin.rim@gmail.com" +git config user.name "inaheaven" +git add --all +git commit -a -m "Travis #$TRAVIS_BUILD_NUMBER" +git push --force origin develop diff --git a/_site/search.json b/_site/search.json new file mode 100644 index 000000000..99b5c5731 --- /dev/null +++ b/_site/search.json @@ -0,0 +1,51 @@ +[ + + { + "title" : "Pixels to Animation", + "category" : "webapp", + "tags" : "Udacity, Canvas, Web, HTML5", + "url" : "/webapp/2019/07/04/Pixels-to-Animation", + "date" : "2019-07-04 00:00:00 +0900" + } , + + { + "title" : "HTML5 Canvas Basics", + "category" : "webapp", + "tags" : "Udacity, Canvas, Web, HTML5", + "url" : "/webapp/2019/07/03/HTML5-Canvas-Basics", + "date" : "2019-07-03 00:00:00 +0900" + } , + + { + "title" : "Page Descriptions", + "category" : "webapp", + "tags" : "", + "url" : "/webapp/2019/07/02/Pages", + "date" : "2019-07-02 00:00:00 +0900" + } , + + { + "title" : "Page Descriptions", + "category" : "ml", + "tags" : "Machine Learning", + "url" : "/ml/2019/07/02/Pages", + "date" : "2019-07-02 00:00:00 +0900" + } , + + { + "title" : "First Post - Greetings", + "category" : "webapp", + "tags" : "", + "url" : "/webapp/2019/07/01/First-Post-Greetings", + "date" : "2019-07-01 00:00:00 +0900" + } , + + { + "title" : "First Post - Greetings", + "category" : "ml", + "tags" : "Machine Learning", + "url" : "/ml/2019/07/01/First-Post-Greetings", + "date" : "2019-07-01 00:00:00 +0900" + } + +] diff --git a/_site/sitemap.xml b/_site/sitemap.xml new file mode 100644 index 000000000..244e8cc42 --- /dev/null +++ b/_site/sitemap.xml @@ -0,0 +1,39 @@ + + + +https://inaheaven.github.io/Home-Org2/ml/2019/07/01/First-Post-Greetings +2019-07-01T00:00:00+09:00 + + +https://inaheaven.github.io/Home-Org2/webapp/2019/07/01/First-Post-Greetings +2019-07-01T00:00:00+09:00 + + +https://inaheaven.github.io/Home-Org2/ml/2019/07/02/Pages +2019-07-02T00:00:00+09:00 + + +https://inaheaven.github.io/Home-Org2/webapp/2019/07/02/Pages +2019-07-02T00:00:00+09:00 + + +https://inaheaven.github.io/Home-Org2/webapp/2019/07/03/HTML5-Canvas-Basics +2019-07-03T00:00:00+09:00 + + +https://inaheaven.github.io/Home-Org2/webapp/2019/07/04/Pixels-to-Animation +2019-07-04T00:00:00+09:00 + + +https://inaheaven.github.io/Home-Org2/ + + +https://inaheaven.github.io/Home-Org2/tags.html + + +https://inaheaven.github.io/Home-Org2/ml/ + + +https://inaheaven.github.io/Home-Org2/webapp/ + + diff --git a/_site/tags.html b/_site/tags.html new file mode 100644 index 000000000..c97877fd7 --- /dev/null +++ b/_site/tags.html @@ -0,0 +1 @@ + Tag Archive – Inaheaven
      Posts /

      Tag Archive

      Back to Lists /
      ❖

      Canvas

      HTML5

      Machine Learning

      Udacity

      Web


      Twitter Facebook Google+
      diff --git a/_site/webapp/2019/07/01/First-Post-Greetings.html b/_site/webapp/2019/07/01/First-Post-Greetings.html new file mode 100644 index 000000000..7b9da0f04 --- /dev/null +++ b/_site/webapp/2019/07/01/First-Post-Greetings.html @@ -0,0 +1 @@ + First Post - Greetings – Inaheaven
      Posts /

      First Post - Greetings

      Back to Lists /
       MACHINE
      LEARNING       WEB/APP PROJECTS
      01 Jul 2019

      Hi all,

      This is my first post of this blog/portfolio page.

      I will update posts as often as possible.

      If you have any questions, find a bug, or just want to say hi,

      feel free to shoot me an email by clicking the email icon on the left side of home.

      (you can go back to home by clicking the top-left icon)

      See you soon.


      Twitter Facebook Google+
      diff --git a/_site/webapp/2019/07/02/Pages.html b/_site/webapp/2019/07/02/Pages.html new file mode 100644 index 000000000..00c36e193 --- /dev/null +++ b/_site/webapp/2019/07/02/Pages.html @@ -0,0 +1 @@ + Page Descriptions – Inaheaven
      Posts /

      Page Descriptions

      Back to Lists /
       MACHINE
      LEARNING       WEB/APP PROJECTS
      02 Jul 2019

      Hey,

      I will update some of my works, researches and studies in machine learning,

      and some web-based/ applications works on the separate page.

      Lastly, projects page will include my resume, conducted projects and research results.


      Twitter Facebook Google+
      diff --git a/_site/webapp/2019/07/03/HTML5-Canvas-Basics.html b/_site/webapp/2019/07/03/HTML5-Canvas-Basics.html new file mode 100644 index 000000000..faab1d085 --- /dev/null +++ b/_site/webapp/2019/07/03/HTML5-Canvas-Basics.html @@ -0,0 +1,123 @@ + HTML5 Canvas Basics – Inaheaven
      Posts /

      HTML5 Canvas Basics

      Back to Lists /
       MACHINE
      LEARNING       WEB/APP PROJECTS
      03 Jul 2019

      This is a summary of Udacity’s HTML5 Canvas coursework.

      You can find the full course materials here: Full Course Page

      Introduction

      • Canvas - powerful API which you can use to edit, resize, and otherwise change images, animations, and interactions.
      • By using the canvas tag, can create a canvas and web page
      • Canvas is a 2D surface that takes intructions and immediately renders them.
      • Canvas has a set of functions that allow us to draw shapes, images, text, and patterns.

      Creating a Canvas

      <!DOCTYPE HTML>
+<html>
+<head></head>
+<body>
+    <canvas id ="c" width="200" height="200"> </canvas>
+    <script>
+        var c = document.querySelector("#c");
+        var ctx = c.getContext("2d");
+    </script>
+</body>
+</html>
+
      • The canvas tag takes optional width and height parameters to allocate some space on the web page.
      • But that will only give the physical space on the website to work with.
      • To use a canvas, access it from the JS code.
        • Grab the canvas using the selector to get the can vas with the id of c from the body.
        • Grab the context, call the method, getContext, on the canvas that we have created, and pass in this parameter for 2d.

      Coordinate System - Quiz

      Unlike the ‘usual’ coordinates from geometric perspectives, coordinate system in canvas starts from the top-left corner and gets bigger if go right (x-axis), or if go down (y-axis).

      Coordinate System in Canvas

      Question

      Coordinate System in Canvas - Quiz

      Loading Images Code

      <!DOCTYPE HTML>
+<html>
+<head></head>
+<body>
+    <canvas id ="c" width="200" height="200"> </canvas>
+    <script>
+        var c = document.querySelector("#c");
+        var ctx = c.getContext("2d");
+        
+        var image = new Image();
+        
+        image.onload = function() {
+            console.log("Loaded Image");
+            // doSomethingElse();
+            ctx.drawImage(image, 0, 0, c.width, c.height);
+        }
+        
+        image.src = "some_random_image.png";
+    </script>
+</body>
+</html>
+
      • Use a local file as well as image files on the Internet with URL.
      • Images in JavaScript get loaded asynchronously, meaning that we need to do work after it is loaded.
      • For example, in here, grab the context, and call drawImage method on the context of the canvas.
      • As a param, pass the image itself, starting coordinate x,y, its width and height.
      • Examples of Loading Images: Find the code executions in CodePen
      var c = document.querySelector("#c");
+var ctx = c.getContext("2d");
+        
+var image = new Image();
+        
+image.onload = function() {
+    console.log("Loaded Image");
+    ctx.drawImage(image, 0, 0, c.width, c.height);
+            
+    var savedImage = c.toDataURL();
+    window.open(savedImage);
+            
+}
+image.src = "some_random_image.png";
+
      • Added two lines sho`uld open the image in the new window,
      • But Uncaught DOM Exception: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported. error occurs.
      • This is safely hosting and serving image issues.
      • You can take some detour to save images,but having own server will solve this issues more properly.
      • The instructor offered: Python SimpleHTTPServer, MAMP, Node to make this work with simple HTTP web server. Detailed instructions can be found here

      Drawing Rectangles

      <!DOCTYPE HTML>
+<html>
+<head></head>
+<body>
+    <canvas id ="c" width="500" height="500"> </canvas>
+    <script>
+        var c = document.querySelector("#c");
+        var ctx = c.getContext("2d");
+        
+        ctx.fillRect(100, 100, 100, 100);
+        ctx.strokeRect(50, 50, 50, 50);
+    </script>
+</body>
+</html>    
+
      • In the code above, called the fillRect, strokeRect.
      • The params of each function include the position of x,y axis and width and height of the rectangle.
      • Can use fillStyle, instead of fillRect with the color selections.
      • Also use clearRect to edit, without modifying the fillStyle
      • Examples of fillRect, strokeRect: Find the code executions in CodePen
      • Examples of clearRect: Find the code executions in CodePen

      Paths - Quiz

      <!DOCTYPE HTML>
+<html>
+<head></head>
+<body>
+    <canvas id ="c" width="500" height="500"> </canvas>
+    <script>
+        var c = document.querySelector("#c");
+        var ctx = c.getContext("2d");
+        
+        ctx.beginPath()
+        ctx.moveTo(10,10);
+        ctx.lineTo(50,50);
+        ctx.lineTo(50,10);
+        ctx.lineTo(10,10);
+        ctx.fill();
+        // ctx.stroke();
+    </script>
+</body>
+</html>    
+
      • As above, instead of drawing a rectangle right away with fillRect or strokeRect, can draw lines with lineTo, after moving the pen position by moveTo;
      • After, can fill in by fill, and draw borders only without fill by stroke
      • Examples of moveTo, lineTo, fill, stroke: Find the code executions in CodePen

      Moving Objects in a Canvas

      Scaling

      • Use scale(x,y) mutiplies the x and y values by a given param
        • for example, ctx.scale(2,3) will make all values twice as large on the x axis and three times as larege on the y-axis.

      Translation

      • Use translate(x,y) moves all subsequent draw commands by x number of pixels on horizontally and y pixels vertically.
        • for example, ctx.translate(20,40); will move all the elements in the context 20 pixels to the right and 40 pixels down.

      Rotation

      • use rotate(angleRadians) rotates an object about its center
        • radians = degrees * (MATH.PI/180)

      Saving and Restoring Canvas State

      • Every canvas object contains a stack of drawing states. (LIFO structure)
      • The code below shows the effect of save and restore.
      • Can save some attributes of context as a default with save, and restore the default even after making modifications to the context.
      • Examples of save, restore: Find the code executions in CodePen
      var c = document.querySelector("#c");
+var ctx = c.getContext("2d");
+
+ctx.fillStyle = "blue";
+ctx.fillRect(0,0,50,50);
+
+// Save state with blue fill
+ctx.save();
+ctx.fillStyle = "green";
+ctx.fillRect(100,100,10,10);
+// Restore to blue fill
+ctx.restore();
+
+ctx.fillRect(200,10,20,20);
+

      Colors

      • Can add colors to the fill and the stroke by strokeStyle and fillStyle.
      • For the strokes, you have to add color before calling stroke.
      • Examples of strokeStyle, fillStyle: Find the code executions in CodePen
      var c = document.querySelector("#c");
+var ctx = c.getContext("2d"); 
+
+ctx.strokeStyle = "#33CC33";
+
+ctx.strokeRect(50, 50, 100., 100);
+ctx.beginPath();
+ctx.moveTo(75,75);
+ctx.lineTo(125, 125);
+ctx.lineTo(125,75);
+
+ctx.fillStyle = "blue";
+ctx.fill();
+

      Drawing Text

      • Can write text with strokeText in canvas.
      • When writing a text with strokeText, the lower left corner of the first alphabet is located at (0,0) coordinate. Therefore positioning text at 0,0 will show no result.
      • Add fonts with ctx.font = 'size style'
        • for example, ctx.font = ‘40px serif’
      • Also can some additional styles texts by
        • font = value
        • textAlign = value
        • direction = value
      • More advanced:
        • measureText: returns a TextMetrics object containing the width, in pixels, that the specified text will be when drawn in the current text style.

        • more information can be found here drawing text docs

      Meme Creator

      var c = document.querySelector("#c");
+var ctx = c.getContext("2d"); 
+var image = new Image();
+image.onload = function(){
+    ctx.drawImage(image, 0,0,c.width, c.height);
+    ctx.font = "26pt Impact";
+    ctx.textAlign = "center";
+    ctx.fillStyle = "white";
+    ctx.fillText("Hello World", c.width/2, 50);
+
+    ctx.strokeStyle = "black";
+    ctx.lineWidth = 3;
+    ctx.strokeText("Canvas Memes", c.width/2, c.height-10);
+}
+
+image.src = "some_random_image.png"
+

      Answers for the Quiz

      • Coordinate Systems
        • A: (2,1), B: (3,2), C: (1,3)
      Please be aware that this is a summary of the Udacity Course HTML5 Canvas Basics. You can find the course here: Full Course Page.
      In here, I attached some image clips from the lecture vids and free images in CodePen are from unsplash.com, taken by Muzammil Soorma. If you find a bug or have any problems (copyrights of the codes, images, quotes or any), please contact me at my email in the cover page.

      Twitter Facebook Google+
      diff --git a/_site/webapp/2019/07/04/Pixels-to-Animation.html b/_site/webapp/2019/07/04/Pixels-to-Animation.html new file mode 100644 index 000000000..5b95f1b9d --- /dev/null +++ b/_site/webapp/2019/07/04/Pixels-to-Animation.html @@ -0,0 +1,33 @@ + Pixels to Animation – Inaheaven
      Posts /

      Pixels to Animation

      Back to Lists /
       MACHINE
      LEARNING       WEB/APP PROJECTS
      04 Jul 2019

      This is a summary of Udacity’s HTML5 Canvas coursework.

      You can find the full course materials here: Full Course Page

      Introduction

      • Pixels make up the data of a photo.
      • Every color imaginable can be represented with a combination of red, green and blue.
      • Depending on the type of image you are storing in the computer, there is an additional alpha channel that stores how solid or transparent the final color will be.

      Filters and effects

      • Why edit images in browser?
        • Doing locally edit allows the user to make changes without a full round trip to the server.
      • Such tasks can be done with/ without external libraries:
        • make an image black and white by averaging the rgb values
        • invert the colors by assigning the pixels to the compliments of the current values
        • turn out the lights/ or turn on the night visions

      Quiz: Canvas 2D Image Data

      • Image backing a canvas is represented in JS with an Image Data Object.
      • It contains values for the width, and height of the source image in pixels, along with the data array containing the red, green, blue and alpha values for each pixel.
      • data property is usually represented by a Uint8Clampled Array.
        • U means that their rate is unsigned or contains only positive values.
        • Int8 indicates that it will store 8-bit numbers. (8-bit positive numbers from 0 to 255.)
        • if JS was making it easy, the data for one pixel would be separated from all the others like this.
        • instead, it is one giant list you have to parse when you apply effects.
        • we can retrieve or modify the image data by calling one of these functions.
          • createImageData: initializes a blank image data object that you can modify
          • getImageData: retrieve data to a backing canvas
          • putImageData: store data to a backing canvas

      • Try working with Image Data 1) Create a canvas2d rendering context 2) call get imagedata to retrieve the pixels in the canvas 3) change every 10th pixel to a solid green color Hint) Colors values range from 0-255

      • Canvas2Drendering: Find the code executions in CodePen
      <!DOCTYPE HTML>
+<html>
+<head></head>
+<body>
+    <canvas id ="c" width="400" height="400"> </canvas>
+    <script>
+       var c = document.querySelector("#c");
+       var ctx = c.getContext("2d");
+       data = ctx.getImageData(0,0,400,400);
+       
+       function paintGreen(imageData) {
+            var numPixels = imageData.data.length/4;
+            for (var i=0; i<numPixels; i++) {
+                if(i%10 == 0) {
+                   imageData.data[i*4+1] = 255;
+                   //set alpha values as well
+                   imageData.data[i*4+3] = 255;
+                }
+            }
+            ctx.putImageData(imageData,0,0);
+       }
+       paintGreen(data);
+    </script>
+</body>
+</html>
+

      Playing Video in Canvas

      • Quiz
        • What will this code do? 
          var draw = function() {
+canvas.getContext("2d").drawImage(v, 0, 0);
+}
+v.addEventListener('play', function() {
+if (v.paused || v.ended) return;
+draw();
+});
+
        • shows the video in sync with the source video
        • shows a single frame of the video

        ** Find the Answer Below of the Page.

      Answers for the Quiz

      • Playing Video in Canvas
        • Shows a single frame of the video
      Please be aware that this is a summary of the Udacity Course HTML5 Canvas Basics. You can find the course here: Full Course Page.
      In here, I attached some image clips from the lecture vids and free images in CodePen are from unsplash.com, taken by Muzammil Soorma. If you find a bug or have any problems (copyrights of the codes, images, quotes or any), please contact me at my email in the cover page.

      Twitter Facebook Google+
      diff --git a/_site/webapp/index.html b/_site/webapp/index.html new file mode 100644 index 000000000..055b47f97 --- /dev/null +++ b/_site/webapp/index.html @@ -0,0 +1 @@ + Web and Applications – Inaheaven

      Web and Applications/

       MACHINE
      LEARNING       WEB/APP PROJECTS
      diff --git a/assets/_sass/_site.scss b/assets/_sass/_site.scss index a462a2b82..a2656621c 100644 --- a/assets/_sass/_site.scss +++ b/assets/_sass/_site.scss @@ -139,6 +139,148 @@ canvas { } } +.ml-menu-icon { + position: absolute; + top: 30px; + right: 155px; + width: 20px; + height: 25px; + border: 2px solid $gray; + background: $white; + &:before { + content: ''; + width: 20px; + height: 25px; + position: absolute; + right: 2px; + border: 2px solid $gray; + top: 2px; + background: $white; + } + &:after { + content: ''; + width: 20px; + height: 25px; + border: 2px solid $gray; + position: absolute; + right: 6px; + top: 6px; + background: $white; + } + &:hover { + border-color: $green; + &:before, + &:after { + border-color: $green; + } + } +} + +.webapp-menu-icon { + position: absolute; + top: 30px; + right: 95px; + width: 20px; + height: 25px; + border: 2px solid $gray; + background: $white; + &:before { + content: ''; + width: 20px; + height: 25px; + position: absolute; + right: 2px; + border: 2px solid $gray; + top: 2px; + background: $white; + } + &:after { + content: ''; + width: 20px; + height: 25px; + border: 2px solid $gray; + position: absolute; + right: 6px; + top: 6px; + background: $white; + } + &:hover { + border-color: $green; + &:before, + &:after { + border-color: $green; + } + } +} + +#search-container { + margin: auto; + width: 400px; + + input[type=text] { + color: gray; + outline: none; + padding: 15px 25px; + margin: 5px 1px 3px 0px; + border: none; + width: 100%; + border-radius: 1px; + box-shadow: 0 1px 0px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08); + + } + + input[type=text]:hover { + outline: none; + border: none; + margin: 5px 1px 3px 0px; + padding: 15px 25px; + -webkit-transition: all 0.30s ease-in-out; + -moz-transition: all 0.30s ease-in-out; + -ms-transition: all 0.30s ease-in-out; + -o-transition: all 0.30s ease-in-out; + box-shadow: 0 2px 2px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08); + } + + input[type=text]:focus { + box-shadow: 0 2px 2px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08); + margin: 5px 1px 3px 0px; + padding: 15px 25px; + border: none; + outline: none; + -webkit-transition: all 0.30s ease-in-out; + -moz-transition: all 0.30s ease-in-out; + -ms-transition: all 0.30s ease-in-out; + -o-transition: all 0.30s ease-in-out; + } + + @media screen and (max-width: 600px) { + input[type=text]{ + width: 100%; + box-sizing: border-box; + } + } + + #results-container { + color: #399f62; + display: block; + list-style-type: disc; + margin-block-start: 1em; + margin-block-end: 1em; + margin-inline-start: 0px; + margin-inline-end: 0px; + padding-inline-start: 40px; + + } + a { + color: #399f62; + } +} + + + + +.ml-link, +.webapp-link, .posts-link, .projects-link { position: absolute; @@ -147,6 +289,14 @@ canvas { color: darken($white, 40); } +.ml-link { + right: 145px; +} + +.webapp-link { + right: 85px; +} + .posts-link { right: 90px; } @@ -827,15 +977,16 @@ canvas { border: none !important; } .pagination { - display: flex; + display: inline-block; + text-align: center; flex-direction: row; justify-content: space-between; width: 100%; margin-top: 1em; &_pager { display: inline-block; - padding: 0.75em; - min-width: 5.5em; + padding: 0.5em 0.75em; + margin-bottom: 0.5em; font-size: 0.8em; font-weight: 400; background-color: darken($white, 5%); @@ -869,3 +1020,25 @@ canvas { } } } + +.pagination a { + color: black; + padding: 8px 16px; + text-decoration: none; + border-radius: 5px; +} + +.pagination a.active { + background-color: #4CAF50; + border-radius: 5px; + color: white; +} + +.pagination a:hover:not(.active) {background-color: #ddd;} + +.no_page { + color: black; + padding: 8px 16px; + text-decoration: none; + border-radius: 5px; +} diff --git a/assets/js/canvas.js b/assets/js/canvas.js index 32c62da2c..13b3491da 100644 --- a/assets/js/canvas.js +++ b/assets/js/canvas.js @@ -1 +1 @@ -$(function(){var canvas=document.querySelector('canvas'),ctx=canvas.getContext('2d'),color='#eeeeee';canvas.width=window.innerWidth;canvas.height=window.innerHeight;canvas.style.display='block';ctx.fillStyle=color;ctx.lineWidth=.1;ctx.strokeStyle=color;var dots={nb:500,distance:80,d_radius:150,array:[]};function Dot() {this.x=Math.random()*canvas.width;this.y=Math.random()*canvas.height;this.vx=-.5+Math.random();this.vy=-.5+Math.random();this.radius=Math.random();}Dot.prototype={create:function(){ctx.beginPath();ctx.arc(this.x,this.y,this.radius,0,Math.PI*2,false);ctx.fill();}};function makeDots(){for(i=0;icanvas.height){dot.vx=dot.vx;dot.vy=-dot.vy;}else if(dot.x<0||dot.x>canvas.width){dot.vx=-dot.vx;dot.vy=dot.vy;}dot.x+=dot.vx;dot.y+=dot.vy;}}function animateDots(){ctx.clearRect(0, 0, canvas.width, canvas.height);for(i=0;icanvas.height){dot.vx=dot.vx;dot.vy=-dot.vy;}else if(dot.x<0||dot.x>canvas.width){dot.vx=-dot.vx;dot.vy=dot.vy;}dot.x+=dot.vx;dot.y+=dot.vy;}}function animateDots(){ctx.clearRect(0, 0, canvas.width, canvas.height);for(i=0;i tlen) { + return false; + } + if (qlen === tlen) { + return needle === haystack; + } + outer: for (var i = 0, j = 0; i < qlen; i++) { + var nch = needle.charCodeAt(i); + while (j < tlen) { + if (haystack.charCodeAt(j++) === nch) { + continue outer; + } + } + return false; + } + return true; + } + + var _$fuzzysearch_1 = fuzzysearch; + + 'use strict' + + /* removed: var _$fuzzysearch_1 = require('fuzzysearch') */; + + var _$FuzzySearchStrategy_5 = new FuzzySearchStrategy() + + function FuzzySearchStrategy () { + this.matches = function (string, crit) { + return _$fuzzysearch_1(crit.toLowerCase(), string.toLowerCase()) + } + } + + 'use strict' + + var _$LiteralSearchStrategy_6 = new LiteralSearchStrategy() + + function LiteralSearchStrategy () { + this.matches = function (str, crit) { + if (!str) return false + + str = str.trim().toLowerCase() + crit = crit.trim().toLowerCase() + + return crit.split(' ').filter(function (word) { + return str.indexOf(word) >= 0 + }).length === crit.split(' ').length + } + } + + 'use strict' + + var _$Repository_4 = { + put: put, + clear: clear, + search: search, + setOptions: setOptions + } + + /* removed: var _$FuzzySearchStrategy_5 = require('./SearchStrategies/FuzzySearchStrategy') */; + /* removed: var _$LiteralSearchStrategy_6 = require('./SearchStrategies/LiteralSearchStrategy') */; + + function NoSort () { + return 0 + } + + var data = [] + var opt = {} + + opt.fuzzy = false + opt.limit = 10 + opt.searchStrategy = opt.fuzzy ? _$FuzzySearchStrategy_5 : _$LiteralSearchStrategy_6 + opt.sort = NoSort + + function put (data) { + if (isObject(data)) { + return addObject(data) + } + if (isArray(data)) { + return addArray(data) + } + return undefined + } + function clear () { + data.length = 0 + return data + } + + function isObject (obj) { + return Boolean(obj) && Object.prototype.toString.call(obj) === '[object Object]' + } + + function isArray (obj) { + return Boolean(obj) && Object.prototype.toString.call(obj) === '[object Array]' + } + + function addObject (_data) { + data.push(_data) + return data + } + + function addArray (_data) { + var added = [] + clear() + for (var i = 0, len = _data.length; i < len; i++) { + if (isObject(_data[i])) { + added.push(addObject(_data[i])) + } + } + return added + } + + function search (crit) { + if (!crit) { + return [] + } + return findMatches(data, crit, opt.searchStrategy, opt).sort(opt.sort) + } + + function setOptions (_opt) { + opt = _opt || {} + + opt.fuzzy = _opt.fuzzy || false + opt.limit = _opt.limit || 10 + opt.searchStrategy = _opt.fuzzy ? _$FuzzySearchStrategy_5 : _$LiteralSearchStrategy_6 + opt.sort = _opt.sort || NoSort + } + + function findMatches (data, crit, strategy, opt) { + var matches = [] + for (var i = 0; i < data.length && matches.length < opt.limit; i++) { + var match = findMatchesInObject(data[i], crit, strategy, opt) + if (match) { + matches.push(match) + } + } + return matches + } + + function findMatchesInObject (obj, crit, strategy, opt) { + for (var key in obj) { + if (!isExcluded(obj[key], opt.exclude) && strategy.matches(obj[key], crit)) { + return obj + } + } + } + + function isExcluded (term, excludedTerms) { + var excluded = false + excludedTerms = excludedTerms || [] + for (var i = 0, len = excludedTerms.length; i < len; i++) { + var excludedTerm = excludedTerms[i] + if (!excluded && new RegExp(term).test(excludedTerm)) { + excluded = true + } + } + return excluded + } + + 'use strict' + + var _$Templater_7 = { + compile: compile, + setOptions: __setOptions_7 + } + + var options = {} + options.pattern = /\{(.*?)\}/g + options.template = '' + options.middleware = function () {} + + function __setOptions_7 (_options) { + options.pattern = _options.pattern || options.pattern + options.template = _options.template || options.template + if (typeof _options.middleware === 'function') { + options.middleware = _options.middleware + } + } + + function compile (data) { + return options.template.replace(options.pattern, function (match, prop) { + var value = options.middleware(prop, data[prop], options.template) + if (typeof value !== 'undefined') { + return value + } + return data[prop] || match + }) + } + + 'use strict' + + var _$utils_9 = { + merge: merge, + isJSON: isJSON + } + + function merge (defaultParams, mergeParams) { + var mergedOptions = {} + for (var option in defaultParams) { + mergedOptions[option] = defaultParams[option] + if (typeof mergeParams[option] !== 'undefined') { + mergedOptions[option] = mergeParams[option] + } + } + return mergedOptions + } + + function isJSON (json) { + try { + if (json instanceof Object && JSON.parse(JSON.stringify(json))) { + return true + } + return false + } catch (err) { + return false + } + } + + var _$src_8 = {}; + (function (window) { + 'use strict' + + var options = { + searchInput: null, + resultsContainer: null, + json: [], + success: Function.prototype, + searchResultTemplate: '
    • {title}
      • ', + templateMiddleware: Function.prototype, + sortMiddleware: function () { + return 0 + }, + noResultsText: 'No results found', + limit: 10, + fuzzy: false, + exclude: [] + } + + var requiredOptions = ['searchInput', 'resultsContainer', 'json'] + + /* removed: var _$Templater_7 = require('./Templater') */; + /* removed: var _$Repository_4 = require('./Repository') */; + /* removed: var _$JSONLoader_2 = require('./JSONLoader') */; + var optionsValidator = _$OptionsValidator_3({ + required: requiredOptions + }) + /* removed: var _$utils_9 = require('./utils') */; + + window.SimpleJekyllSearch = function (_options) { + var errors = optionsValidator.validate(_options) + if (errors.length > 0) { + throwError('You must specify the following required options: ' + requiredOptions) + } + + options = _$utils_9.merge(options, _options) + + _$Templater_7.setOptions({ + template: options.searchResultTemplate, + middleware: options.templateMiddleware + }) + + _$Repository_4.setOptions({ + fuzzy: options.fuzzy, + limit: options.limit, + sort: options.sortMiddleware + }) + + if (_$utils_9.isJSON(options.json)) { + initWithJSON(options.json) + } else { + initWithURL(options.json) + } + + return { + search: search + } + } + + function initWithJSON (json) { + options.success(json) + _$Repository_4.put(json) + registerInput() + } + + function initWithURL (url) { + _$JSONLoader_2.load(url, function (err, json) { + if (err) { + throwError('failed to get JSON (' + url + ')') + } + initWithJSON(json) + }) + } + + function emptyResultsContainer () { + options.resultsContainer.innerHTML = '' + } + + function appendToResultsContainer (text) { + options.resultsContainer.innerHTML += text + } + + function registerInput () { + options.searchInput.addEventListener('keyup', function (e) { + if (isWhitelistedKey(e.which)) { + emptyResultsContainer() + search(e.target.value) + } + }) + } + + function search (query) { + if (isValidQuery(query)) { + emptyResultsContainer() + render(_$Repository_4.search(query), query) + } + } + + function render (results, query) { + var len = results.length + if (len === 0) { + return appendToResultsContainer(options.noResultsText) + } + for (var i = 0; i < len; i++) { + results[i].query = query + appendToResultsContainer(_$Templater_7.compile(results[i])) + } + } + + function isValidQuery (query) { + return query && query.length > 0 + } + + function isWhitelistedKey (key) { + return [13, 16, 20, 37, 38, 39, 40, 91].indexOf(key) === -1 + } + + function throwError (message) { + throw new Error('SimpleJekyllSearch --- ' + message) + } + })(window) + +}()); diff --git a/_posts/2009-05-15-edge-case-nested-and-mixed-lists.md b/format/_posts/2009-05-15-edge-case-nested-and-mixed-lists.md similarity index 96% rename from _posts/2009-05-15-edge-case-nested-and-mixed-lists.md rename to format/_posts/2009-05-15-edge-case-nested-and-mixed-lists.md index 485aed234..2bc25e630 100644 --- a/_posts/2009-05-15-edge-case-nested-and-mixed-lists.md +++ b/format/_posts/2009-05-15-edge-case-nested-and-mixed-lists.md @@ -9,6 +9,7 @@ tags: - edge case - lists - markup +published: false --- Nested and mixed lists are an interesting beast. It's a corner case to make sure that @@ -21,7 +22,7 @@ Nested and mixed lists are an interesting beast. It's a corner case to make sure 1. ordered item 2. ordered item * **unordered** - * **unordered** + * **unordered** fe 1. ordered item 2. ordered item 3. ordered item diff --git a/_posts/2009-08-06-edge-case-no-body-content.md b/format/_posts/2009-08-06-edge-case-no-body-content.md similarity index 88% rename from _posts/2009-08-06-edge-case-no-body-content.md rename to format/_posts/2009-08-06-edge-case-no-body-content.md index 2a70d8d90..5787c0815 100644 --- a/_posts/2009-08-06-edge-case-no-body-content.md +++ b/format/_posts/2009-08-06-edge-case-no-body-content.md @@ -7,4 +7,5 @@ tags: - content - edge case - layout +published: false --- diff --git a/_posts/2009-09-05-edge-case-no-yaml-title.md b/format/_posts/2009-09-05-edge-case-no-yaml-title.md similarity index 92% rename from _posts/2009-09-05-edge-case-no-yaml-title.md rename to format/_posts/2009-09-05-edge-case-no-yaml-title.md index b564fd062..a8aee28c2 100644 --- a/_posts/2009-09-05-edge-case-no-yaml-title.md +++ b/format/_posts/2009-09-05-edge-case-no-yaml-title.md @@ -6,6 +6,7 @@ tags: - edge case - layout - title +published: false --- This post has no title specified in the YAML Front Matter. Jekyll should auto-generate a title from the filename. diff --git a/_posts/2009-10-05-edge-case-title-should-not-overflow-the-content-area.md b/format/_posts/2009-10-05-edge-case-title-should-not-overflow-the-content-area.md similarity index 97% rename from _posts/2009-10-05-edge-case-title-should-not-overflow-the-content-area.md rename to format/_posts/2009-10-05-edge-case-title-should-not-overflow-the-content-area.md index bf8b4e064..de371f431 100644 --- a/_posts/2009-10-05-edge-case-title-should-not-overflow-the-content-area.md +++ b/format/_posts/2009-10-05-edge-case-title-should-not-overflow-the-content-area.md @@ -10,6 +10,7 @@ tags: - html - layout - title +published: false --- ## Title should not overflow the content area diff --git a/_posts/2010-01-08-post-chat.md b/format/_posts/2010-01-08-post-chat.md similarity index 99% rename from _posts/2010-01-08-post-chat.md rename to format/_posts/2010-01-08-post-chat.md index 65d7a2fa6..3f3298866 100644 --- a/_posts/2010-01-08-post-chat.md +++ b/format/_posts/2010-01-08-post-chat.md @@ -6,6 +6,7 @@ categories: tags: - chat - Post Formats +published: false --- **Abbott:** Strange as it may seem, they give ball players nowadays very peculiar names. diff --git a/_posts/2010-02-05-post-notice.md b/format/_posts/2010-02-05-post-notice.md similarity index 99% rename from _posts/2010-02-05-post-notice.md rename to format/_posts/2010-02-05-post-notice.md index a3f061b44..77067b1d7 100644 --- a/_posts/2010-02-05-post-notice.md +++ b/format/_posts/2010-02-05-post-notice.md @@ -6,6 +6,7 @@ categories: tags: - Post Formats - notice +published: false --- A notice displays information that explains nearby content. Often used to call attention to a particular detail. diff --git a/_posts/2010-02-05-post-quote.md b/format/_posts/2010-02-05-post-quote.md similarity index 94% rename from _posts/2010-02-05-post-quote.md rename to format/_posts/2010-02-05-post-quote.md index 79c1eba0c..8be5ffccd 100644 --- a/_posts/2010-02-05-post-quote.md +++ b/format/_posts/2010-02-05-post-quote.md @@ -6,6 +6,7 @@ categories: tags: - Post Formats - quote +published: false --- > Only one thing is impossible for God: To find any sense in any copyright law on the planet. diff --git a/_posts/2010-06-02-post-video-youtube.md b/format/_posts/2010-06-02-post-video-youtube.md similarity index 94% rename from _posts/2010-06-02-post-video-youtube.md rename to format/_posts/2010-06-02-post-video-youtube.md index 793360714..cb51582aa 100644 --- a/_posts/2010-06-02-post-video-youtube.md +++ b/format/_posts/2010-06-02-post-video-youtube.md @@ -5,6 +5,7 @@ categories: - Post Formats tags: - Post Formats +published: false --- YouTube video embed below. diff --git a/_posts/2010-08-05-post-image-linked.md b/format/_posts/2010-08-05-post-image-linked.md similarity index 92% rename from _posts/2010-08-05-post-image-linked.md rename to format/_posts/2010-08-05-post-image-linked.md index c29e42ddd..08c35a25e 100644 --- a/_posts/2010-08-05-post-image-linked.md +++ b/format/_posts/2010-08-05-post-image-linked.md @@ -6,6 +6,7 @@ categories: tags: - image - Post Formats +published: false --- [![foo](https://farm5.staticflickr.com/4073/4939853213_33ffc0290b_b.jpg)](https://flic.kr/p/8ww3fZ) diff --git a/_posts/2010-08-05-post-image-standard.md b/format/_posts/2010-08-05-post-image-standard.md similarity index 97% rename from _posts/2010-08-05-post-image-standard.md rename to format/_posts/2010-08-05-post-image-standard.md index 02effed9f..67b0b7c23 100644 --- a/_posts/2010-08-05-post-image-standard.md +++ b/format/_posts/2010-08-05-post-image-standard.md @@ -6,6 +6,7 @@ categories: tags: - image - Post Formats +published: false --- The preferred way of using images is placing them in the `/images/` directory and referencing them with an absolute path. Prepending the filename with `{% raw %}{{ site.url }}/images/{% endraw %}` will make sure your images display properly in feeds and such. diff --git a/_posts/2010-08-06-post-image-linked-caption.md b/format/_posts/2010-08-06-post-image-linked-caption.md similarity index 96% rename from _posts/2010-08-06-post-image-linked-caption.md rename to format/_posts/2010-08-06-post-image-linked-caption.md index b77b03336..90ac52f00 100644 --- a/_posts/2010-08-06-post-image-linked-caption.md +++ b/format/_posts/2010-08-06-post-image-linked-caption.md @@ -6,6 +6,7 @@ categories: tags: - image - Post Formats +published: false --- {% capture fig_img %} diff --git a/_posts/2010-08-07-post-image-caption.md b/format/_posts/2010-08-07-post-image-caption.md similarity index 95% rename from _posts/2010-08-07-post-image-caption.md rename to format/_posts/2010-08-07-post-image-caption.md index 1d0c4d947..f1857989b 100644 --- a/_posts/2010-08-07-post-image-caption.md +++ b/format/_posts/2010-08-07-post-image-caption.md @@ -6,6 +6,7 @@ categories: tags: - image - Post Formats +published: false --- {% capture fig_img %} diff --git a/_posts/2010-09-10-post-twitter-embeds.md b/format/_posts/2010-09-10-post-twitter-embeds.md similarity index 97% rename from _posts/2010-09-10-post-twitter-embeds.md rename to format/_posts/2010-09-10-post-twitter-embeds.md index 2a17e4e71..04e075682 100644 --- a/_posts/2010-09-10-post-twitter-embeds.md +++ b/format/_posts/2010-09-10-post-twitter-embeds.md @@ -8,6 +8,7 @@ tags: - embeds - media - twitter +published: false --- diff --git a/_posts/2012-03-15-layout-header-image-external.md b/format/_posts/2012-03-15-layout-header-image-external.md similarity index 95% rename from _posts/2012-03-15-layout-header-image-external.md rename to format/_posts/2012-03-15-layout-header-image-external.md index 4742fca9e..a16c0c4cf 100644 --- a/_posts/2012-03-15-layout-header-image-external.md +++ b/format/_posts/2012-03-15-layout-header-image-external.md @@ -10,6 +10,7 @@ tags: - featured image - image - layout +published: false --- This post should display a **header image**, if the theme supports it. diff --git a/_posts/2012-03-15-layout-header-image-horizontal.md b/format/_posts/2012-03-15-layout-header-image-horizontal.md similarity index 95% rename from _posts/2012-03-15-layout-header-image-horizontal.md rename to format/_posts/2012-03-15-layout-header-image-horizontal.md index 88f6b96fd..81b678d20 100644 --- a/_posts/2012-03-15-layout-header-image-horizontal.md +++ b/format/_posts/2012-03-15-layout-header-image-horizontal.md @@ -10,6 +10,7 @@ tags: - featured image - image - layout +published: false --- This post should display a **header image**, if the theme supports it. diff --git a/_posts/2012-03-15-layout-header-image-text-readability.md b/format/_posts/2012-03-15-layout-header-image-text-readability.md similarity index 99% rename from _posts/2012-03-15-layout-header-image-text-readability.md rename to format/_posts/2012-03-15-layout-header-image-text-readability.md index 060166d38..85a5615b2 100644 --- a/_posts/2012-03-15-layout-header-image-text-readability.md +++ b/format/_posts/2012-03-15-layout-header-image-text-readability.md @@ -6,6 +6,7 @@ tags: - sample post - readability - test +published: false --- This is a sample post with a large feature image up top and tons of text. Odio ad blue bottle vinyl, 90's narwhal commodo bitters pour-over nostrud. Ugh est hashtag in, fingerstache adipisicing laboris esse Pinterest shabby chic Portland. Shoreditch bicycle rights anim, flexitarian laboris put a bird on it vinyl cupidatat narwhal. Hashtag artisan skateboard, flannel Bushwick nesciunt salvia aute fixie do plaid post-ironic dolor McSweeney's. Cliche pour-over chambray nulla four loko skateboard sapiente hashtag. diff --git a/_posts/2012-03-15-layout-header-image-vertical.md b/format/_posts/2012-03-15-layout-header-image-vertical.md similarity index 95% rename from _posts/2012-03-15-layout-header-image-vertical.md rename to format/_posts/2012-03-15-layout-header-image-vertical.md index 432150c06..c7569dceb 100644 --- a/_posts/2012-03-15-layout-header-image-vertical.md +++ b/format/_posts/2012-03-15-layout-header-image-vertical.md @@ -10,6 +10,7 @@ tags: - featured image - image - layout +published: false --- This post should display a **header image**, if the theme supports it. diff --git a/_posts/2013-01-05-markup-title-with-markup.md b/format/_posts/2013-01-05-markup-title-with-markup.md similarity index 94% rename from _posts/2013-01-05-markup-title-with-markup.md rename to format/_posts/2013-01-05-markup-title-with-markup.md index 17034bf21..b7ada6f7e 100644 --- a/_posts/2013-01-05-markup-title-with-markup.md +++ b/format/_posts/2013-01-05-markup-title-with-markup.md @@ -7,6 +7,7 @@ tags: - css - html - title +published: false --- Verify that: diff --git a/_posts/2013-01-05-markup-title-with-special-characters.md b/format/_posts/2013-01-05-markup-title-with-special-characters.md similarity index 99% rename from _posts/2013-01-05-markup-title-with-special-characters.md rename to format/_posts/2013-01-05-markup-title-with-special-characters.md index 96d6e3e33..a9b2c3622 100644 --- a/_posts/2013-01-05-markup-title-with-special-characters.md +++ b/format/_posts/2013-01-05-markup-title-with-special-characters.md @@ -8,6 +8,7 @@ tags: - markup - post - title +published: false --- Putting special characters in the title should have no adverse effect on the layout or functionality. diff --git a/_posts/2013-01-09-markup-text-alignment.md b/format/_posts/2013-01-09-markup-text-alignment.md similarity index 99% rename from _posts/2013-01-09-markup-text-alignment.md rename to format/_posts/2013-01-09-markup-text-alignment.md index e40cbb019..e6a45020c 100644 --- a/_posts/2013-01-09-markup-text-alignment.md +++ b/format/_posts/2013-01-09-markup-text-alignment.md @@ -8,6 +8,7 @@ tags: - content - css - markup +published: false --- ### Default diff --git a/_posts/2014-01-10-markup-image-alignment.md b/format/_posts/2014-01-10-markup-image-alignment.md similarity index 99% rename from _posts/2014-01-10-markup-image-alignment.md rename to format/_posts/2014-01-10-markup-image-alignment.md index 49d99b97e..6e57aecdf 100644 --- a/_posts/2014-01-10-markup-image-alignment.md +++ b/format/_posts/2014-01-10-markup-image-alignment.md @@ -7,9 +7,9 @@ tags: - alignment - captions - content - - css + - cssmarkup - image - - markup +published: false --- Welcome to image alignment! The best way to demonstrate the ebb and flow of the various image positioning options is to nestle them snuggly among an ocean of words. Grab a paddle and let's get started. diff --git a/_posts/2014-01-11-markup-html-tags-and-formatting.md b/format/_posts/2014-01-11-markup-html-tags-and-formatting.md similarity index 99% rename from _posts/2014-01-11-markup-html-tags-and-formatting.md rename to format/_posts/2014-01-11-markup-html-tags-and-formatting.md index aec385845..c346e4a58 100644 --- a/_posts/2014-01-11-markup-html-tags-and-formatting.md +++ b/format/_posts/2014-01-11-markup-html-tags-and-formatting.md @@ -9,6 +9,7 @@ tags: - formatting - html - markup +published: false --- A variety of common markup showing how the theme styles them. diff --git a/_posts/2014-05-22-markup-more-images.md b/format/_posts/2014-05-22-markup-more-images.md similarity index 99% rename from _posts/2014-05-22-markup-more-images.md rename to format/_posts/2014-05-22-markup-more-images.md index cc99b460f..8888cd44e 100644 --- a/_posts/2014-05-22-markup-more-images.md +++ b/format/_posts/2014-05-22-markup-more-images.md @@ -7,6 +7,7 @@ tags: - sample post - images - test +published: false --- Here are some examples of what a post with images might look like. If you want to display two or three images next to each other responsively use `figure` with the appropriate `class`. Each instance of `figure` is auto-numbered and displayed in the caption. diff --git a/_posts/2015-08-16-markup-syntax-highlighting.md b/format/_posts/2015-08-16-markup-syntax-highlighting.md similarity index 99% rename from _posts/2015-08-16-markup-syntax-highlighting.md rename to format/_posts/2015-08-16-markup-syntax-highlighting.md index e321d9c42..395bf77ae 100644 --- a/_posts/2015-08-16-markup-syntax-highlighting.md +++ b/format/_posts/2015-08-16-markup-syntax-highlighting.md @@ -5,6 +5,7 @@ excerpt: "Post displaying the various ways of highlighting code in Markdown." tags: - code - syntax highlighting +published: false --- Syntax highlighting is a feature that displays source code, in different colors and fonts according to the category of terms. This feature facilitates writing in a structured language such as a programming language or a markup language as both structures and syntax errors are visually distinct. Highlighting does not affect the meaning of the text itself; it is intended only for human readers.[^1] diff --git a/_posts/2016-05-22-markup-text-readability.md b/format/_posts/2016-05-22-markup-text-readability.md similarity index 99% rename from _posts/2016-05-22-markup-text-readability.md rename to format/_posts/2016-05-22-markup-text-readability.md index 737f8b245..9ca6007e5 100644 --- a/_posts/2016-05-22-markup-text-readability.md +++ b/format/_posts/2016-05-22-markup-text-readability.md @@ -6,6 +6,7 @@ tags: - sample post - readability - test +published: false --- Portland in shoreditch Vice, labore typewriter pariatur hoodie fap sartorial Austin. Pinterest literally occupy Schlitz forage. Odio ad blue bottle vinyl, 90's narwhal commodo bitters pour-over nostrud. Ugh est hashtag in, fingerstache adipisicing laboris esse Pinterest shabby chic Portland. Shoreditch bicycle rights anim, flexitarian laboris put a bird on it vinyl cupidatat narwhal. Hashtag artisan skateboard, flannel Bushwick nesciunt salvia aute fixie do plaid post-ironic dolor McSweeney's. Cliche pour-over chambray nulla four loko skateboard sapiente hashtag. diff --git a/_posts/2016-05-29-halve-theme.md b/format/_posts/2016-05-29-halve-theme.md similarity index 99% rename from _posts/2016-05-29-halve-theme.md rename to format/_posts/2016-05-29-halve-theme.md index 8ac60d6fc..443045777 100644 --- a/_posts/2016-05-29-halve-theme.md +++ b/format/_posts/2016-05-29-halve-theme.md @@ -10,6 +10,7 @@ tag: - vangeltzo - theme - vangelis +published: false --- Home Page of Halve diff --git a/format/_posts/2019-07-01-First-Post.md b/format/_posts/2019-07-01-First-Post.md new file mode 100644 index 000000000..213ee724d --- /dev/null +++ b/format/_posts/2019-07-01-First-Post.md @@ -0,0 +1,25 @@ +--- +layout: post +title: First Post +category: posts +published: False +--- + + +Hi all, + +This is my first post of this blog/portfolio page. + +Will try to update as often as possible. + +If you have any questions, find a bug, or just want to say hi, + +feel free to shoot me an email by clicking the email icon on the left side of home. + +(you can go back to home by clicking the top-left icon) + +or you can simply type in sangmin.rim@gmail.com . + +See you soon. + + diff --git a/images/background/background_1.jpeg b/images/background/background_1.jpeg new file mode 100644 index 000000000..c5a9c0e1f Binary files /dev/null and b/images/background/background_1.jpeg differ diff --git a/images/background/background_10.jpeg b/images/background/background_10.jpeg new file mode 100644 index 000000000..85090d0e2 Binary files /dev/null and b/images/background/background_10.jpeg differ diff --git a/images/background/background_11.jpeg b/images/background/background_11.jpeg new file mode 100644 index 000000000..f17ebbbbc Binary files /dev/null and b/images/background/background_11.jpeg differ diff --git a/images/background/background_12.png b/images/background/background_12.png new file mode 100644 index 000000000..217b20fed Binary files /dev/null and b/images/background/background_12.png differ diff --git a/images/background/background_13.jpeg b/images/background/background_13.jpeg new file mode 100644 index 000000000..8dd1bf47f Binary files /dev/null and b/images/background/background_13.jpeg differ diff --git a/images/background/background_14.png b/images/background/background_14.png new file mode 100644 index 000000000..e91f54d11 Binary files /dev/null and b/images/background/background_14.png differ diff --git a/images/background/background_2.jpeg b/images/background/background_2.jpeg new file mode 100644 index 000000000..f5aaf220c Binary files /dev/null and b/images/background/background_2.jpeg differ diff --git a/images/background/background_3.jpeg b/images/background/background_3.jpeg new file mode 100644 index 000000000..5494e4e00 Binary files /dev/null and b/images/background/background_3.jpeg differ diff --git a/images/background/background_4.jpeg b/images/background/background_4.jpeg new file mode 100644 index 000000000..37b180a9d Binary files /dev/null and b/images/background/background_4.jpeg differ diff --git a/images/background/background_5.jpg b/images/background/background_5.jpg new file mode 100644 index 000000000..875c26100 Binary files /dev/null and b/images/background/background_5.jpg differ diff --git a/images/background/background_6.jpeg b/images/background/background_6.jpeg new file mode 100644 index 000000000..65ee985c4 Binary files /dev/null and b/images/background/background_6.jpeg differ diff --git a/images/background/background_7.jpeg b/images/background/background_7.jpeg new file mode 100644 index 000000000..b250c1f93 Binary files /dev/null and b/images/background/background_7.jpeg differ diff --git a/images/background/background_8.jpeg b/images/background/background_8.jpeg new file mode 100644 index 000000000..2db8e5366 Binary files /dev/null and b/images/background/background_8.jpeg differ diff --git a/images/background/background_9.jpeg b/images/background/background_9.jpeg new file mode 100644 index 000000000..fae884e44 Binary files /dev/null and b/images/background/background_9.jpeg differ diff --git a/images/background/project.jpg b/images/background/project.jpg new file mode 100644 index 000000000..7f8ce43a6 Binary files /dev/null and b/images/background/project.jpg differ diff --git a/images/blog/HTML5 Canvas Basics1.png b/images/blog/HTML5 Canvas Basics1.png new file mode 100644 index 000000000..b07cc515d Binary files /dev/null and b/images/blog/HTML5 Canvas Basics1.png differ diff --git a/images/blog/HTML5 Canvas Basics2.png b/images/blog/HTML5 Canvas Basics2.png new file mode 100644 index 000000000..adbecec3a Binary files /dev/null and b/images/blog/HTML5 Canvas Basics2.png differ diff --git a/images/blog/default.png b/images/blog/default.png new file mode 100644 index 000000000..e91f54d11 Binary files /dev/null and b/images/blog/default.png differ diff --git a/images/default_images/halve-home-image.png b/images/default_images/halve-home-image.png new file mode 100644 index 000000000..c82b9809e Binary files /dev/null and b/images/default_images/halve-home-image.png differ diff --git a/images/default_images/halve-small.png b/images/default_images/halve-small.png new file mode 100644 index 000000000..6887c3552 Binary files /dev/null and b/images/default_images/halve-small.png differ diff --git a/images/default_images/halve.png b/images/default_images/halve.png new file mode 100644 index 000000000..3c57bf00b Binary files /dev/null and b/images/default_images/halve.png differ diff --git a/images/default_images/post-image-halve-1.png b/images/default_images/post-image-halve-1.png new file mode 100644 index 000000000..03df6f895 Binary files /dev/null and b/images/default_images/post-image-halve-1.png differ diff --git a/images/default_images/post-image-halve-2.png b/images/default_images/post-image-halve-2.png new file mode 100644 index 000000000..528cfa006 Binary files /dev/null and b/images/default_images/post-image-halve-2.png differ diff --git a/images/default_images/post-image-halve-3.png b/images/default_images/post-image-halve-3.png new file mode 100644 index 000000000..be2c7d239 Binary files /dev/null and b/images/default_images/post-image-halve-3.png differ diff --git a/images/default_images/post-image-halve-4.png b/images/default_images/post-image-halve-4.png new file mode 100644 index 000000000..b126eae00 Binary files /dev/null and b/images/default_images/post-image-halve-4.png differ diff --git a/images/default_images/post-image-halve-5.png b/images/default_images/post-image-halve-5.png new file mode 100644 index 000000000..1b19526ab Binary files /dev/null and b/images/default_images/post-image-halve-5.png differ diff --git a/images/default_images/post-image-halve-6.png b/images/default_images/post-image-halve-6.png new file mode 100644 index 000000000..d05bef48e Binary files /dev/null and b/images/default_images/post-image-halve-6.png differ diff --git a/images/default_images/unsplash-gallery-image-3.jpg b/images/default_images/unsplash-gallery-image-3.jpg new file mode 100644 index 000000000..3b7e99f84 Binary files /dev/null and b/images/default_images/unsplash-gallery-image-3.jpg differ diff --git a/images/default_images/unsplash-image-1.jpg b/images/default_images/unsplash-image-1.jpg new file mode 100644 index 000000000..24be340b8 Binary files /dev/null and b/images/default_images/unsplash-image-1.jpg differ diff --git a/images/default_images/unsplash-image-10.jpg b/images/default_images/unsplash-image-10.jpg new file mode 100644 index 000000000..92b4595a6 Binary files /dev/null and b/images/default_images/unsplash-image-10.jpg differ diff --git a/images/default_images/unsplash-image-4.jpg b/images/default_images/unsplash-image-4.jpg new file mode 100644 index 000000000..e8eb28ba9 Binary files /dev/null and b/images/default_images/unsplash-image-4.jpg differ diff --git a/images/default_images/unsplash-image-6.jpg b/images/default_images/unsplash-image-6.jpg new file mode 100644 index 000000000..808412eb5 Binary files /dev/null and b/images/default_images/unsplash-image-6.jpg differ diff --git a/images/default_images/unsplash-image-9.jpg b/images/default_images/unsplash-image-9.jpg new file mode 100644 index 000000000..cc826a054 Binary files /dev/null and b/images/default_images/unsplash-image-9.jpg differ diff --git a/images/home.png b/images/home.png deleted file mode 100644 index f3a462f0c..000000000 Binary files a/images/home.png and /dev/null differ diff --git a/images/logo/inaheaven_logo-small.png b/images/logo/inaheaven_logo-small.png new file mode 100644 index 000000000..d4f78e1c0 Binary files /dev/null and b/images/logo/inaheaven_logo-small.png differ diff --git a/images/logo/inaheaven_logo.png b/images/logo/inaheaven_logo.png new file mode 100644 index 000000000..822b74fd9 Binary files /dev/null and b/images/logo/inaheaven_logo.png differ diff --git a/images/logo/site_logo-small.png b/images/logo/site_logo-small.png new file mode 100644 index 000000000..32b893220 Binary files /dev/null and b/images/logo/site_logo-small.png differ diff --git a/images/logo/site_logo.png b/images/logo/site_logo.png new file mode 100644 index 000000000..da051bc9e Binary files /dev/null and b/images/logo/site_logo.png differ diff --git a/images/project/ieee_ecu.png b/images/project/ieee_ecu.png new file mode 100644 index 000000000..4493c3b89 Binary files /dev/null and b/images/project/ieee_ecu.png differ diff --git a/images/project/ingris.png b/images/project/ingris.png new file mode 100644 index 000000000..211a8d4f8 Binary files /dev/null and b/images/project/ingris.png differ diff --git a/images/project/mstudio_admin.png b/images/project/mstudio_admin.png new file mode 100644 index 000000000..431b0f718 Binary files /dev/null and b/images/project/mstudio_admin.png differ diff --git a/index.md b/index.md index ff2b7b8f6..345bf104c 100644 --- a/index.md +++ b/index.md @@ -1,10 +1,18 @@ --- layout: home --- -# About Theme +# About -This theme is Jekyll port of [vangeltzo.com](http://vangeltzo.com/) (by [Vangelis Tzortzis](https://github.com/srekoble)). +Hi All, My name is Sangmin and this is my personal blog and portfolio page. +If you have any questions, find a bug, or just want to say hi, feel free to email me by clicking the email icon on the left. -To learn how to install and use this theme check out the [installation guide](http://taylantatli.me/Halve/halve-theme/) for more information. +
      +Many thanks to Vangelis Tzortzis (from vangeltzo.com),
      +Christian Fei (https://github.com/christian-fei),
      +Sverrir Sigmundarson (https://github.com/sverrirs)
      +for sharing this great theme, searching and pagination tools. -If you have a question, find a bug, or just want to say hi, please open an [issue on GitHub](https://github.com/TaylanTatli/Halve/issues/new). +
      +Find the box below to search my posts by Title, Category, Tag(Keyword) or Date. + + diff --git a/ml/_posts/2019-07-01-First Post - Greetings.md b/ml/_posts/2019-07-01-First Post - Greetings.md new file mode 100644 index 000000000..737252850 --- /dev/null +++ b/ml/_posts/2019-07-01-First Post - Greetings.md @@ -0,0 +1,28 @@ +--- +layout: ml +title: First Post - Greetings +category: 'ml' +tag: +- Machine Learning +--- + + + +Hi all, + +This is my first post of this blog/portfolio page. + +I will update posts as often as possible. + +If you have any questions, find a bug, or just want to say hi, + +feel free to shoot me an email by clicking the email icon on the left side of home. + +(you can go back to home by clicking the top-left icon) + +See you soon. + + + + + diff --git a/ml/_posts/2019-07-02-Pages.md b/ml/_posts/2019-07-02-Pages.md new file mode 100644 index 000000000..5f3dff161 --- /dev/null +++ b/ml/_posts/2019-07-02-Pages.md @@ -0,0 +1,15 @@ +--- +layout: ml +title: Page Descriptions +category: 'ml' +tag: +- Machine Learning +--- + +Hey, + +I will update some of my works, researches and studies in machine learning, + +and some web-based/ applications works on the separate page. + +Lastly, projects page will include my resume, conducted projects and research results. diff --git a/script/cibuild b/script/cibuild new file mode 100644 index 000000000..bd38ba209 --- /dev/null +++ b/script/cibuild @@ -0,0 +1,27 @@ +#!/bin/bash + +# skip if build is triggered by pull request +if [ $TRAVIS_PULL_REQUEST == "true" ]; then + echo "this is PR, exiting" + exit 0 +fi + +# enable error reporting to the console +set -e + +# cleanup "_site" +rm -rf _site +mkdir _site + +# clone remote repo to "_site" +git clone https://${GH_TOKEN}@github.com/inaheaven/Home.git _site +# build with Jekyll into "_site" +bundle exec jekyll build + +# push +cd _site +git config user.email "sangmin.rim@gmail.com" +git config user.name "inaheaven" +git add --all +git commit -a -m "Travis #$TRAVIS_BUILD_NUMBER" +git push --force origin develop diff --git a/search.json b/search.json new file mode 100644 index 000000000..1d55e9dad --- /dev/null +++ b/search.json @@ -0,0 +1,14 @@ +--- +layout: null +--- +[ + {% for post in site.posts %} + { + "title" : "{{ post.title | escape }}", + "category" : "{{ post.category }}", + "tags" : "{{ post.tags | join: ', ' }}", + "url" : "{{ site.baseurl }}{{ post.url }}", + "date" : "{{ post.date }}" + } {% unless forloop.last %},{% endunless %} + {% endfor %} +] diff --git a/webapp/_posts/2019-07-01-First Post - Greetings.md b/webapp/_posts/2019-07-01-First Post - Greetings.md new file mode 100644 index 000000000..cfc4f88ac --- /dev/null +++ b/webapp/_posts/2019-07-01-First Post - Greetings.md @@ -0,0 +1,26 @@ +--- +layout: webapp +title: First Post - Greetings +category: 'webapp' +--- + + + +Hi all, + +This is my first post of this blog/portfolio page. + +I will update posts as often as possible. + +If you have any questions, find a bug, or just want to say hi, + +feel free to shoot me an email by clicking the email icon on the left side of home. + +(you can go back to home by clicking the top-left icon) + +See you soon. + + + + + diff --git a/webapp/_posts/2019-07-02-Pages.md b/webapp/_posts/2019-07-02-Pages.md new file mode 100644 index 000000000..778cfd716 --- /dev/null +++ b/webapp/_posts/2019-07-02-Pages.md @@ -0,0 +1,13 @@ +--- +layout: webapp +title: Page Descriptions +category: 'webapp' +--- + +Hey, + +I will update some of my works, researches and studies in machine learning, + +and some web-based/ applications works on the separate page. + +Lastly, projects page will include my resume, conducted projects and research results. diff --git a/webapp/_posts/2019-07-03-HTML5 Canvas Basics.md b/webapp/_posts/2019-07-03-HTML5 Canvas Basics.md new file mode 100644 index 000000000..b66f0133a --- /dev/null +++ b/webapp/_posts/2019-07-03-HTML5 Canvas Basics.md @@ -0,0 +1,296 @@ +--- +layout: webapp +title: "HTML5 Canvas Basics" +category: 'webapp' +excerpt: "HTML5 Canvas Basics - Learn to draw graphics on the fly using Javascript and the HTML5 Canvas API" +tag: +- Udacity +- Canvas +- Web +- HTML5 +--- + +This is a summary of Udacity's HTML5 Canvas coursework. + +You can find the full course materials here: [Full Course Page](https://classroom.udacity.com/courses/ud292) + +## Introduction +* Canvas - powerful API which you can use to edit, resize, and otherwise change images, animations, and interactions. +* By using the canvas tag, can create a canvas and web page +* Canvas is a `2D surface` that takes intructions and immediately renders them. +* Canvas has a set of functions that allow us to **draw shapes, images, text, and patterns**. + +--- + +## Creating a Canvas + +```html + + + + + + + + +``` + +* The canvas tag takes optional width and height parameters to allocate some space on the web page. +* But that will only give the physical space on the website to work with. +* To use a canvas, access it from the JS code. + * Grab the canvas using the selector to get the can vas with the id of `c` from the body. + * Grab the context, call the method, `getContext`, on the canvas that we have created, and pass in this parameter for 2d. + +--- + +## Coordinate System - Quiz + +Unlike the 'usual' coordinates from geometric perspectives, +coordinate system in canvas starts from the top-left corner and gets bigger if go right (x-axis), or if go down (y-axis). + +![Coordinate System in Canvas]({{ site.url }}/images/blog/HTML5 Canvas Basics1.png) + +#### Question +![Coordinate System in Canvas - Quiz]({{ site.url }}/images/blog/HTML5 Canvas Basics2.png) + +--- + +## Loading Images Code +```html + + + + + + + + +``` + +* Use a local file as well as image files on the Internet with URL. +* Images in JavaScript get loaded asynchronously, meaning that we need to do work after it is loaded. +* For example, in here, grab the context, and call drawImage method on the context of the canvas. +* As a param, pass the image itself, starting coordinate x,y, its width and height. +* Examples of Loading Images: [Find the code executions in CodePen](https://codepen.io/inaheaven/pen/WqKOrw) + +```javascript +var c = document.querySelector("#c"); +var ctx = c.getContext("2d"); + +var image = new Image(); + +image.onload = function() { + console.log("Loaded Image"); + ctx.drawImage(image, 0, 0, c.width, c.height); + + var savedImage = c.toDataURL(); + window.open(savedImage); + +} +image.src = "some_random_image.png"; +``` + +* Added two lines sho`uld open the image in the new window, +* But `Uncaught DOM Exception: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.` error occurs. +* This is safely hosting and serving image issues. +* You can take some detour to save images,but having own server will solve this issues more properly. +* The instructor offered: Python SimpleHTTPServer, MAMP, Node to make this work with simple HTTP web server. [Detailed instructions can be found here](https://classroom.udacity.com/courses/ud292/lessons/3163218691/concepts/32309787260923) + +--- + +## Drawing Rectangles + +```html + + + + + + + + +``` + +* In the code above, called the fillRect, strokeRect. +* The params of each function include the position of x,y axis and width and height of the rectangle. +* Can use `fillStyle`, instead of `fillRect` with the color selections. +* Also use `clearRect` to edit, without modifying the `fillStyle` +* Examples of fillRect, strokeRect: [Find the code executions in CodePen](https://codepen.io/inaheaven/pen/orMeYj) +* Examples of clearRect: [Find the code executions in CodePen](https://codepen.io/inaheaven/pen/YojxeN) + +--- + +## Paths - Quiz + +```html + + + + + + + + +``` + +* As above, instead of drawing a rectangle right away with fillRect or strokeRect, can draw lines with `lineTo`, after moving the pen position by `moveTo`; +* After, can fill in by `fill`, and draw borders only without fill by `stroke` +* Examples of moveTo, lineTo, fill, stroke: [Find the code executions in CodePen](https://codepen.io/inaheaven/pen/LKBowm) + +--- + +## Moving Objects in a Canvas + +* Canvas2D allows to translate (move), rotate, or scale objects. +* Examples of scale, translate, rotate: [Find the code executions in CodePen](https://codepen.io/inaheaven/pen/qzyzKL) + +#### Scaling + +* Use `scale(x,y)` mutiplies the x and y values by a given param + - for example, ctx.scale(2,3) will make all values twice as large on the x axis and three times as larege on the y-axis. + +#### Translation +* Use `translate(x,y)` moves all subsequent draw commands by x number of pixels on horizontally and y pixels vertically. + - for example, ctx.translate(20,40); will move all the elements in the context 20 pixels to the right and 40 pixels down. + +#### Rotation +* use `rotate(angleRadians)` rotates an object about its center + - radians = degrees * (MATH.PI/180) + + +--- + +## Saving and Restoring Canvas State + +* Every canvas object contains a stack of drawing states. (LIFO structure) +* The code below shows the effect of `save` and `restore`. +* Can save some attributes of context as a default with save, and restore the default even after making modifications to the context. +* Examples of save, restore: [Find the code executions in CodePen](https://codepen.io/inaheaven/pen/bPjPXq) + + +```javascript +var c = document.querySelector("#c"); +var ctx = c.getContext("2d"); + +ctx.fillStyle = "blue"; +ctx.fillRect(0,0,50,50); + +// Save state with blue fill +ctx.save(); +ctx.fillStyle = "green"; +ctx.fillRect(100,100,10,10); +// Restore to blue fill +ctx.restore(); + +ctx.fillRect(200,10,20,20); +``` + +--- + +## Colors + +* Can add colors to the fill and the stroke by `strokeStyle` and `fillStyle`. +* For the strokes, you have to add color before calling stroke. +* Examples of strokeStyle, fillStyle: [Find the code executions in CodePen](https://codepen.io/inaheaven/pen/zVLgKb) + +```javascript +var c = document.querySelector("#c"); +var ctx = c.getContext("2d"); + +ctx.strokeStyle = "#33CC33"; + +ctx.strokeRect(50, 50, 100., 100); +ctx.beginPath(); +ctx.moveTo(75,75); +ctx.lineTo(125, 125); +ctx.lineTo(125,75); + +ctx.fillStyle = "blue"; +ctx.fill(); +``` +--- + +## Drawing Text + +* Can write text with strokeText in canvas. +* When writing a text with strokeText, the lower left corner of the first alphabet is located at (0,0) coordinate. Therefore positioning text at 0,0 will show no result. +* Add fonts with `ctx.font = 'size style'` + - for example, ctx.font = '40px serif' +* Also can some additional styles texts by + - font = value + - textAlign = value + - direction = value +* More advanced: + - measureText: returns a `TextMetrics` object containing the width, in pixels, that the specified text will be when drawn in the current text style. + - more information can be found here [drawing text docs](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Drawing_text) +--- + +## Meme Creator + +* Can create memes (text on the image) with the code below. +* This is basically the sum of all above description. +* Examples of meme creator: [Find the code executions in CodePen](https://codepen.io/inaheaven/pen/vqzYWw) + +```javascript +var c = document.querySelector("#c"); +var ctx = c.getContext("2d"); +var image = new Image(); +image.onload = function(){ + ctx.drawImage(image, 0,0,c.width, c.height); + ctx.font = "26pt Impact"; + ctx.textAlign = "center"; + ctx.fillStyle = "white"; + ctx.fillText("Hello World", c.width/2, 50); + + ctx.strokeStyle = "black"; + ctx.lineWidth = 3; + ctx.strokeText("Canvas Memes", c.width/2, c.height-10); +} + +image.src = "some_random_image.png" +``` + +--- + +## Answers for the Quiz +* Coordinate Systems + * **A: (2,1), B: (3,2), C: (1,3)** + + +--- + +##### Please be aware that this is a summary of the Udacity Course HTML5 Canvas Basics. You can find the course here: [Full Course Page](https://classroom.udacity.com/courses/ud292). +##### In here, I attached some image clips from the lecture vids and free images in CodePen are from unsplash.com, taken by Muzammil Soorma. If you find a bug or have any problems (copyrights of the codes, images, quotes or any), please contact me at my email in the cover page. diff --git a/webapp/_posts/2019-07-04-Pixels to Animation.md b/webapp/_posts/2019-07-04-Pixels to Animation.md new file mode 100644 index 000000000..1800ea7e6 --- /dev/null +++ b/webapp/_posts/2019-07-04-Pixels to Animation.md @@ -0,0 +1,116 @@ +--- +layout: webapp +title: "Pixels to Animation" +category: 'webapp' +excerpt: "Pixels to Animation - Learn to draw graphics on the fly using Javascript and the HTML5 Canvas API" +tag: +- Udacity +- Canvas +- Web +- HTML5 +--- + +This is a summary of Udacity's HTML5 Canvas coursework. + +You can find the full course materials here: [Full Course Page](https://classroom.udacity.com/courses/ud292) + +## Introduction + +* Pixels make up the data of a photo. +* Every color imaginable can be represented with a combination of red, green and blue. +* Depending on the type of image you are storing in the computer, +there is an additional alpha channel that stores how solid or transparent the final color will be. + +--- + +## Filters and effects + +* Why edit images in browser? + * Doing locally edit allows the user to make changes without a full round trip to the server. +* Such tasks can be done with/ without external libraries: + * make an image black and white by averaging the rgb values + * invert the colors by assigning the pixels to the compliments of the current values + * turn out the lights/ or turn on the night visions + +--- + +## Quiz: Canvas 2D Image Data + +* Image backing a canvas is represented in JS with an Image Data Object. +* It contains values for the width, and height of the source image in pixels, along with the data array containing the red, green, blue and alpha values for each pixel. +* data property is usually represented by a Uint8Clampled Array. + * U means that their rate is unsigned or contains only positive values. + * Int8 indicates that it will store 8-bit numbers. (8-bit positive numbers from 0 to 255.) + * if JS was making it easy, the data for one pixel would be separated from all the others like this. + * instead, it is one giant list you have to parse when you apply effects. + * we can retrieve or modify the image data by calling one of these functions. + * createImageData: initializes a blank image data object that you can modify + * getImageData: retrieve data to a backing canvas + * putImageData: store data to a backing canvas +* Try working with Image Data + 1) Create a canvas2d rendering context + 2) call get imagedata to retrieve the pixels in the canvas + 3) change every 10th pixel to a solid green color + Hint) Colors values range from 0-255 + +* Canvas2Drendering: [Find the code executions in CodePen](https://codepen.io/inaheaven/pen/wLYaNN) + +```html + + + + + + + + +``` + +--- + +## Playing Video in Canvas + +* Quiz + - What will this code do? + ```javascript + var draw = function() { + canvas.getContext("2d").drawImage(v, 0, 0); + } + v.addEventListener('play', function() { + if (v.paused || v.ended) return; + draw(); + }); + ``` + - shows the video in sync with the source video + - shows a single frame of the video + + ** Find the Answer Below of the Page. + + +--- + +## Answers for the Quiz +* Playing Video in Canvas + - Shows a single frame of the video + +--- + +##### Please be aware that this is a summary of the Udacity Course HTML5 Canvas Basics. You can find the course here: [Full Course Page](https://classroom.udacity.com/courses/ud292). +##### In here, I attached some image clips from the lecture vids and free images in CodePen are from unsplash.com, taken by Muzammil Soorma. If you find a bug or have any problems (copyrights of the codes, images, quotes or any), please contact me at my email in the cover page.