Full Code of hacke2/hacke2.github.io for AI

master 7acd627fb514 cached
833 files
8.2 MB
2.2M tokens
2193 symbols
1 requests
Download .txt
Showing preview only (8,961K chars total). Download the full file or copy to clipboard to get everything.
Repository: hacke2/hacke2.github.io
Branch: master
Commit: 7acd627fb514
Files: 833
Total size: 8.2 MB

Directory structure:
gitextract_t3zun56q/

├── .about.md.swp
├── .gitignore
├── .jshintrc
├── .project
├── 404.md
├── CNAME
├── Gemfile
├── Gruntfile.js
├── LICENSE
├── README.md
├── Rakefile.rb
├── _config.yml
├── _includes/
│   ├── browser-upgrade.html
│   ├── disqus_comments.html
│   ├── footer.html
│   ├── head.html
│   ├── navigation.html
│   └── scripts.html
├── _layouts/
│   ├── page.html
│   ├── post-index.html
│   └── post.html
├── _posts/
│   ├── 2014-10-1-for-me-1.html
│   ├── 2014-10-1-mongoose-populate.md
│   ├── 2014-10-11-the-golden-key.md
│   ├── 2014-10-14-links-share-2014-10-14.md
│   ├── 2014-10-2-great-nodejs.md
│   ├── 2014-10-20-tink-in-Ghostjs.md
│   ├── 2014-10-22-html5-javascript-web-dep.md
│   ├── 2014-10-29-2014-10-d2.md
│   ├── 2014-10-3-node-westom-mina.md
│   ├── 2014-10-31-es6-modules-today-with-6to5.md
│   ├── 2014-11-10-javascript-aop.md
│   ├── 2014-11-11-hello-mobile-aop.md
│   ├── 2014-11-12-create-github-page.md
│   ├── 2014-11-14-answer-how-to-prepare.md
│   ├── 2014-11-18-about-responsive.md
│   ├── 2014-11-30-gugong.md
│   ├── 2014-11-8-arrow-functions-and-their-scope.md
│   ├── 2014-12-2-fe-cut-image.md
│   ├── 2014-12-8-my-university-experience.md
│   ├── 2014-8-29-hello-memory-leak.md
│   ├── 2014-8-29-web-development-process.md
│   ├── 2014-8-31-javascript-quiz.md
│   ├── 2014-9-1-cqut-paging.md
│   ├── 2014-9-1-oschina-angularjs.md
│   ├── 2014-9-10-level-img-change.md
│   ├── 2014-9-11-nodeJS-char.md
│   ├── 2014-9-12-css3-lenove.md
│   ├── 2014-9-18-no-sleep.md
│   ├── 2014-9-2-what-happens-when-you-type-in-a-url-in-browser.md
│   ├── 2014-9-26-div-center.md
│   ├── 2014-9-26-think-in-seo.md
│   ├── 2014-9-28-gokk.md
│   ├── 2014-9-30-nodeJS-sublime-3.md
│   ├── 2014-9-4-javascript-seamless-handover.md
│   ├── 2014-9-4-my-show-4-angularjs.md
│   ├── 2015-1-13-what-you-need-to-know-about-block-scope-let.md
│   ├── 2015-1-14-2015-plan.md
│   ├── 2015-10-21-scroll-in-uc.md
│   ├── 2015-10-9-javascript-iterables-and-iterators.md
│   ├── 2015-11-17-use-node-build-static-blog.md
│   ├── 2015-2-25-Variables-and-scoping-in-ECMAScript-6.md
│   ├── 2015-3-13-anmi-strange-problem.md
│   ├── 2015-3-20-css-multi-row-overflow.md
│   ├── 2015-3-23-frame-animation.md
│   ├── 2015-3-4-to-teacher.md
│   ├── 2015-3-7-share-jsbin.md
│   ├── 2015-5-18-how-i-m-using-es6-modules-in-production.md
│   ├── 2015-9-16-express-node-act.md
│   ├── 2016-1-1-review-2015.md
│   ├── 2016-2-1-configuring-babel-6-for-node-js.md
│   ├── 2016-6-19-think-in-react-redux-1.md
│   └── 2017-01-22-review-2016.md
├── about.md
├── assets/
│   ├── assets/
│   │   └── js/
│   │       └── plugins/
│   │           ├── jquery.dlmenu.js
│   │           ├── jquery.fitvids.js
│   │           └── jquery.magnific-popup.js
│   ├── css/
│   │   └── main.css
│   ├── fonts/
│   │   └── FontAwesome.otf
│   ├── js/
│   │   ├── _main.js
│   │   └── plugins/
│   │       ├── jquery.dlmenu.js
│   │       ├── jquery.fitvids.js
│   │       ├── jquery.magnific-popup.js
│   │       └── respond.js
│   └── less/
│       ├── coderay.less
│       ├── dl-menu.less
│       ├── elements.less
│       ├── font-awesome/
│       │   ├── bordered-pulled.less
│       │   ├── core.less
│       │   ├── fixed-width.less
│       │   ├── font-awesome.less
│       │   ├── icons.less
│       │   ├── larger.less
│       │   ├── list.less
│       │   ├── mixins.less
│       │   ├── path.less
│       │   ├── rotated-flipped.less
│       │   ├── spinning.less
│       │   ├── stacked.less
│       │   └── variables.less
│       ├── font-awesome.less
│       ├── gist.less
│       ├── grid.less
│       ├── magnific-popup.less
│       ├── main.less
│       ├── mixins.less
│       ├── page.less
│       ├── pygments.less
│       ├── reset.less
│       ├── site.less
│       ├── typography.less
│       └── variables.less
├── common/
│   └── js/
│       ├── ajax.js
│       ├── startmove.js
│       └── test.js
├── demo/
│   ├── 2014-11/
│   │   ├── ali-media.html
│   │   ├── ali-percent.html
│   │   ├── ali-px.html
│   │   └── ali-rem.html
│   ├── absolute_percent.html
│   ├── cqut-paging/
│   │   └── demo.html
│   ├── css3/
│   │   └── imocoo_2.html
│   ├── javascript-seamless-handover/
│   │   ├── css/
│   │   │   ├── main.css
│   │   │   └── reset.css
│   │   ├── index.html
│   │   └── slide/
│   │       ├── bd01.html
│   │       ├── css/
│   │       │   └── slide.css
│   │       └── js/
│   │           └── startmove.js
│   ├── js-template/
│   │   └── demo.html
│   ├── mobile/
│   │   └── position/
│   │       ├── absolute.html
│   │       ├── flex.html
│   │       └── reset.css
│   └── my-show-4-angularjs/
│       ├── index.html
│       ├── index.js
│       ├── js/
│       │   ├── angular-1.3.0.js
│       │   ├── angular-animate.js
│       │   ├── angular-route.js
│       │   ├── angular-ui-router.js
│       │   └── ui-bootstrap-tpls-0.11.0.js
│       └── pages/
│           ├── about.html
│           ├── contact.html
│           ├── home.html
│           └── project.html
├── feed.xml
├── index.html
├── monthly/
│   └── index.html
├── package.json
├── posts.html
├── ppt/
│   ├── css/
│   │   ├── font-awesome.css
│   │   ├── nodeppt.css
│   │   ├── pdf.css
│   │   ├── pen.cur
│   │   ├── phone.css
│   │   ├── theme.blue.css
│   │   ├── theme.dark.css
│   │   ├── theme.green.css
│   │   ├── theme.light.css
│   │   └── theme.moon.css
│   ├── express.html
│   ├── fonts/
│   │   ├── .font-spider/
│   │   │   └── fontawesome-webfont
│   │   └── FontAwesome.otf
│   ├── js/
│   │   ├── event/
│   │   │   └── broadcast.js
│   │   ├── highlight/
│   │   │   ├── default.css
│   │   │   ├── highlight.pack.js
│   │   │   ├── hljs-0.8.js
│   │   │   ├── languages/
│   │   │   │   ├── 1c.js
│   │   │   │   ├── actionscript.js
│   │   │   │   ├── apache.js
│   │   │   │   ├── applescript.js
│   │   │   │   ├── asciidoc.js
│   │   │   │   ├── autohotkey.js
│   │   │   │   ├── avrasm.js
│   │   │   │   ├── axapta.js
│   │   │   │   ├── bash.js
│   │   │   │   ├── brainfuck.js
│   │   │   │   ├── capnproto.js
│   │   │   │   ├── clojure.js
│   │   │   │   ├── cmake.js
│   │   │   │   ├── coffeescript.js
│   │   │   │   ├── cpp.js
│   │   │   │   ├── cs.js
│   │   │   │   ├── css.js
│   │   │   │   ├── d.js
│   │   │   │   ├── delphi.js
│   │   │   │   ├── diff.js
│   │   │   │   ├── django.js
│   │   │   │   ├── dos.js
│   │   │   │   ├── elixir.js
│   │   │   │   ├── erlang-repl.js
│   │   │   │   ├── erlang.js
│   │   │   │   ├── fix.js
│   │   │   │   ├── fsharp.js
│   │   │   │   ├── gherkin.js
│   │   │   │   ├── glsl.js
│   │   │   │   ├── go.js
│   │   │   │   ├── gradle.js
│   │   │   │   ├── haml.js
│   │   │   │   ├── handlebars.js
│   │   │   │   ├── haskell.js
│   │   │   │   ├── haxe.js
│   │   │   │   ├── http.js
│   │   │   │   ├── ini.js
│   │   │   │   ├── java.js
│   │   │   │   ├── javascript.js
│   │   │   │   ├── json.js
│   │   │   │   ├── lasso.js
│   │   │   │   ├── lisp.js
│   │   │   │   ├── livecodeserver.js
│   │   │   │   ├── lua.js
│   │   │   │   ├── makefile.js
│   │   │   │   ├── markdown.js
│   │   │   │   ├── mathematica.js
│   │   │   │   ├── matlab.js
│   │   │   │   ├── mel.js
│   │   │   │   ├── mizar.js
│   │   │   │   ├── monkey.js
│   │   │   │   ├── nginx.js
│   │   │   │   ├── nimrod.js
│   │   │   │   ├── nix.js
│   │   │   │   ├── nsis.js
│   │   │   │   ├── objectivec.js
│   │   │   │   ├── ocaml.js
│   │   │   │   ├── oxygene.js
│   │   │   │   ├── parser3.js
│   │   │   │   ├── perl.js
│   │   │   │   ├── php.js
│   │   │   │   ├── profile.js
│   │   │   │   ├── protobuf.js
│   │   │   │   ├── python.js
│   │   │   │   ├── r.js
│   │   │   │   ├── rib.js
│   │   │   │   ├── rsl.js
│   │   │   │   ├── ruby.js
│   │   │   │   ├── ruleslanguage.js
│   │   │   │   ├── rust.js
│   │   │   │   ├── scala.js
│   │   │   │   ├── scilab.js
│   │   │   │   ├── scss.js
│   │   │   │   ├── smalltalk.js
│   │   │   │   ├── sql.js
│   │   │   │   ├── swift.js
│   │   │   │   ├── tex.js
│   │   │   │   ├── thrift.js
│   │   │   │   ├── typescript.js
│   │   │   │   ├── vala.js
│   │   │   │   ├── vbnet.js
│   │   │   │   ├── vbscript.js
│   │   │   │   ├── vhdl.js
│   │   │   │   ├── vim.js
│   │   │   │   ├── x86asm.js
│   │   │   │   └── xml.js
│   │   │   └── styles/
│   │   │       ├── arta.css
│   │   │       ├── ascetic.css
│   │   │       ├── atelier-dune.dark.css
│   │   │       ├── atelier-dune.light.css
│   │   │       ├── atelier-forest.dark.css
│   │   │       ├── atelier-forest.light.css
│   │   │       ├── atelier-heath.dark.css
│   │   │       ├── atelier-heath.light.css
│   │   │       ├── atelier-lakeside.dark.css
│   │   │       ├── atelier-lakeside.light.css
│   │   │       ├── atelier-seaside.dark.css
│   │   │       ├── atelier-seaside.light.css
│   │   │       ├── brown_paper.css
│   │   │       ├── codepen-embed.css
│   │   │       ├── color-brewer.css
│   │   │       ├── dark.css
│   │   │       ├── default.css
│   │   │       ├── docco.css
│   │   │       ├── far.css
│   │   │       ├── foundation.css
│   │   │       ├── github.css
│   │   │       ├── googlecode.css
│   │   │       ├── hybrid.css
│   │   │       ├── idea.css
│   │   │       ├── ir_black.css
│   │   │       ├── kimbie.dark.css
│   │   │       ├── kimbie.light.css
│   │   │       ├── magula.css
│   │   │       ├── mono-blue.css
│   │   │       ├── monokai.css
│   │   │       ├── monokai_sublime.css
│   │   │       ├── obsidian.css
│   │   │       ├── paraiso.dark.css
│   │   │       ├── paraiso.light.css
│   │   │       ├── pojoaque.css
│   │   │       ├── railscasts.css
│   │   │       ├── rainbow.css
│   │   │       ├── school_book.css
│   │   │       ├── solarized_dark.css
│   │   │       ├── solarized_light.css
│   │   │       ├── sunburst.css
│   │   │       ├── tomorrow-night-blue.css
│   │   │       ├── tomorrow-night-bright.css
│   │   │       ├── tomorrow-night-eighties.css
│   │   │       ├── tomorrow-night.css
│   │   │       ├── tomorrow.css
│   │   │       ├── vs.css
│   │   │       ├── xcode.css
│   │   │       └── zenburn.css
│   │   ├── img.screenfull.js
│   │   ├── mixjs/
│   │   │   ├── .npmignore
│   │   │   ├── Gruntfile.js
│   │   │   ├── MIT-LICENSE.txt
│   │   │   ├── README.md
│   │   │   ├── lib/
│   │   │   │   ├── event/
│   │   │   │   │   ├── broadcast.js
│   │   │   │   │   └── wait.js
│   │   │   │   ├── mix-0.2.js
│   │   │   │   └── mix.0.3.0.js
│   │   │   ├── package.json
│   │   │   ├── research/
│   │   │   │   ├── js.php
│   │   │   │   ├── load-test.html
│   │   │   │   ├── loadjs.html
│   │   │   │   └── userAgent.html
│   │   │   └── src/
│   │   │       ├── Module.js
│   │   │       ├── Promise.js
│   │   │       ├── browser.js
│   │   │       ├── core.js
│   │   │       ├── getCurrentScript.js
│   │   │       ├── getPath.js
│   │   │       ├── intro.js
│   │   │       ├── loadcss-img.js
│   │   │       ├── loadcss.js
│   │   │       ├── loadjs.js
│   │   │       ├── outro.js
│   │   │       ├── typeof.js
│   │   │       └── vars.js
│   │   ├── nodeppt.control.js
│   │   ├── nodeppt.control.postMessage.js
│   │   ├── nodeppt.control.socket.js
│   │   ├── nodeppt.js
│   │   ├── prettify.js
│   │   ├── qrcode.js
│   │   ├── shake.js
│   │   ├── socket.io.js
│   │   └── zoom.js
│   ├── node-generator-koa/
│   │   ├── css/
│   │   │   ├── animation.css
│   │   │   ├── font-awesome.css
│   │   │   ├── nodeppt.css
│   │   │   ├── nodeppt2.0.css
│   │   │   ├── pdf.css
│   │   │   ├── pen.cur
│   │   │   ├── phone.css
│   │   │   ├── theme.blue.css
│   │   │   ├── theme.dark.css
│   │   │   ├── theme.green.css
│   │   │   ├── theme.light.css
│   │   │   └── theme.moon.css
│   │   ├── fonts/
│   │   │   └── FontAwesome.otf
│   │   ├── index.html
│   │   └── js/
│   │       ├── event/
│   │       │   └── broadcast.js
│   │       ├── highlight/
│   │       │   ├── default.css
│   │       │   ├── highlight.pack.js
│   │       │   ├── hljs-0.8.js
│   │       │   ├── languages/
│   │       │   │   ├── 1c.js
│   │       │   │   ├── actionscript.js
│   │       │   │   ├── apache.js
│   │       │   │   ├── applescript.js
│   │       │   │   ├── asciidoc.js
│   │       │   │   ├── autohotkey.js
│   │       │   │   ├── avrasm.js
│   │       │   │   ├── axapta.js
│   │       │   │   ├── bash.js
│   │       │   │   ├── brainfuck.js
│   │       │   │   ├── capnproto.js
│   │       │   │   ├── clojure.js
│   │       │   │   ├── cmake.js
│   │       │   │   ├── coffeescript.js
│   │       │   │   ├── cpp.js
│   │       │   │   ├── cs.js
│   │       │   │   ├── css.js
│   │       │   │   ├── d.js
│   │       │   │   ├── delphi.js
│   │       │   │   ├── diff.js
│   │       │   │   ├── django.js
│   │       │   │   ├── dos.js
│   │       │   │   ├── elixir.js
│   │       │   │   ├── erlang-repl.js
│   │       │   │   ├── erlang.js
│   │       │   │   ├── fix.js
│   │       │   │   ├── fsharp.js
│   │       │   │   ├── gherkin.js
│   │       │   │   ├── glsl.js
│   │       │   │   ├── go.js
│   │       │   │   ├── gradle.js
│   │       │   │   ├── haml.js
│   │       │   │   ├── handlebars.js
│   │       │   │   ├── haskell.js
│   │       │   │   ├── haxe.js
│   │       │   │   ├── http.js
│   │       │   │   ├── ini.js
│   │       │   │   ├── java.js
│   │       │   │   ├── javascript.js
│   │       │   │   ├── json.js
│   │       │   │   ├── lasso.js
│   │       │   │   ├── lisp.js
│   │       │   │   ├── livecodeserver.js
│   │       │   │   ├── lua.js
│   │       │   │   ├── makefile.js
│   │       │   │   ├── markdown.js
│   │       │   │   ├── mathematica.js
│   │       │   │   ├── matlab.js
│   │       │   │   ├── mel.js
│   │       │   │   ├── mizar.js
│   │       │   │   ├── monkey.js
│   │       │   │   ├── nginx.js
│   │       │   │   ├── nimrod.js
│   │       │   │   ├── nix.js
│   │       │   │   ├── nsis.js
│   │       │   │   ├── objectivec.js
│   │       │   │   ├── ocaml.js
│   │       │   │   ├── oxygene.js
│   │       │   │   ├── parser3.js
│   │       │   │   ├── perl.js
│   │       │   │   ├── php.js
│   │       │   │   ├── profile.js
│   │       │   │   ├── protobuf.js
│   │       │   │   ├── python.js
│   │       │   │   ├── r.js
│   │       │   │   ├── rib.js
│   │       │   │   ├── rsl.js
│   │       │   │   ├── ruby.js
│   │       │   │   ├── ruleslanguage.js
│   │       │   │   ├── rust.js
│   │       │   │   ├── scala.js
│   │       │   │   ├── scilab.js
│   │       │   │   ├── scss.js
│   │       │   │   ├── smalltalk.js
│   │       │   │   ├── sql.js
│   │       │   │   ├── swift.js
│   │       │   │   ├── tex.js
│   │       │   │   ├── thrift.js
│   │       │   │   ├── typescript.js
│   │       │   │   ├── vala.js
│   │       │   │   ├── vbnet.js
│   │       │   │   ├── vbscript.js
│   │       │   │   ├── vhdl.js
│   │       │   │   ├── vim.js
│   │       │   │   ├── x86asm.js
│   │       │   │   └── xml.js
│   │       │   └── styles/
│   │       │       ├── arta.css
│   │       │       ├── ascetic.css
│   │       │       ├── atelier-dune.dark.css
│   │       │       ├── atelier-dune.light.css
│   │       │       ├── atelier-forest.dark.css
│   │       │       ├── atelier-forest.light.css
│   │       │       ├── atelier-heath.dark.css
│   │       │       ├── atelier-heath.light.css
│   │       │       ├── atelier-lakeside.dark.css
│   │       │       ├── atelier-lakeside.light.css
│   │       │       ├── atelier-seaside.dark.css
│   │       │       ├── atelier-seaside.light.css
│   │       │       ├── brown_paper.css
│   │       │       ├── codepen-embed.css
│   │       │       ├── color-brewer.css
│   │       │       ├── dark.css
│   │       │       ├── default.css
│   │       │       ├── docco.css
│   │       │       ├── far.css
│   │       │       ├── foundation.css
│   │       │       ├── github.css
│   │       │       ├── googlecode.css
│   │       │       ├── hybrid.css
│   │       │       ├── idea.css
│   │       │       ├── ir_black.css
│   │       │       ├── kimbie.dark.css
│   │       │       ├── kimbie.light.css
│   │       │       ├── magula.css
│   │       │       ├── mono-blue.css
│   │       │       ├── monokai.css
│   │       │       ├── monokai_sublime.css
│   │       │       ├── obsidian.css
│   │       │       ├── paraiso.dark.css
│   │       │       ├── paraiso.light.css
│   │       │       ├── pojoaque.css
│   │       │       ├── railscasts.css
│   │       │       ├── rainbow.css
│   │       │       ├── school_book.css
│   │       │       ├── solarized_dark.css
│   │       │       ├── solarized_light.css
│   │       │       ├── sunburst.css
│   │       │       ├── tomorrow-night-blue.css
│   │       │       ├── tomorrow-night-bright.css
│   │       │       ├── tomorrow-night-eighties.css
│   │       │       ├── tomorrow-night.css
│   │       │       ├── tomorrow.css
│   │       │       ├── vs.css
│   │       │       ├── xcode.css
│   │       │       └── zenburn.css
│   │       ├── img.screenfull.js
│   │       ├── mixjs/
│   │       │   ├── .npmignore
│   │       │   ├── Gruntfile.js
│   │       │   ├── MIT-LICENSE.txt
│   │       │   ├── README.md
│   │       │   ├── lib/
│   │       │   │   ├── event/
│   │       │   │   │   ├── broadcast.js
│   │       │   │   │   └── wait.js
│   │       │   │   ├── mix-0.2.js
│   │       │   │   └── mix.0.3.0.js
│   │       │   ├── package.json
│   │       │   ├── research/
│   │       │   │   ├── js.php
│   │       │   │   ├── load-test.html
│   │       │   │   ├── loadjs.html
│   │       │   │   └── userAgent.html
│   │       │   └── src/
│   │       │       ├── Module.js
│   │       │       ├── Promise.js
│   │       │       ├── browser.js
│   │       │       ├── core.js
│   │       │       ├── getCurrentScript.js
│   │       │       ├── getPath.js
│   │       │       ├── intro.js
│   │       │       ├── loadcss-img.js
│   │       │       ├── loadcss.js
│   │       │       ├── loadjs.js
│   │       │       ├── outro.js
│   │       │       ├── typeof.js
│   │       │       └── vars.js
│   │       ├── nodeppt.control.js
│   │       ├── nodeppt.control.postMessage.js
│   │       ├── nodeppt.control.socket.js
│   │       ├── nodeppt.js
│   │       ├── prettify.js
│   │       ├── qrcode.js
│   │       ├── shake.js
│   │       └── socket.io.js
│   └── think-in-css/
│       ├── css/
│       │   ├── font-awesome.css
│       │   ├── nodeppt.css
│       │   ├── pdf.css
│       │   ├── pen.cur
│       │   ├── phone.css
│       │   ├── theme.blue.css
│       │   ├── theme.dark.css
│       │   ├── theme.green.css
│       │   ├── theme.light.css
│       │   └── theme.moon.css
│       ├── fonts/
│       │   ├── .font-spider/
│       │   │   └── fontawesome-webfont
│       │   └── FontAwesome.otf
│       ├── index.html
│       ├── js/
│       │   ├── event/
│       │   │   └── broadcast.js
│       │   ├── highlight/
│       │   │   ├── default.css
│       │   │   ├── highlight.pack.js
│       │   │   ├── hljs-0.8.js
│       │   │   ├── languages/
│       │   │   │   ├── 1c.js
│       │   │   │   ├── actionscript.js
│       │   │   │   ├── apache.js
│       │   │   │   ├── applescript.js
│       │   │   │   ├── asciidoc.js
│       │   │   │   ├── autohotkey.js
│       │   │   │   ├── avrasm.js
│       │   │   │   ├── axapta.js
│       │   │   │   ├── bash.js
│       │   │   │   ├── brainfuck.js
│       │   │   │   ├── capnproto.js
│       │   │   │   ├── clojure.js
│       │   │   │   ├── cmake.js
│       │   │   │   ├── coffeescript.js
│       │   │   │   ├── cpp.js
│       │   │   │   ├── cs.js
│       │   │   │   ├── css.js
│       │   │   │   ├── d.js
│       │   │   │   ├── delphi.js
│       │   │   │   ├── diff.js
│       │   │   │   ├── django.js
│       │   │   │   ├── dos.js
│       │   │   │   ├── elixir.js
│       │   │   │   ├── erlang-repl.js
│       │   │   │   ├── erlang.js
│       │   │   │   ├── fix.js
│       │   │   │   ├── fsharp.js
│       │   │   │   ├── gherkin.js
│       │   │   │   ├── glsl.js
│       │   │   │   ├── go.js
│       │   │   │   ├── gradle.js
│       │   │   │   ├── haml.js
│       │   │   │   ├── handlebars.js
│       │   │   │   ├── haskell.js
│       │   │   │   ├── haxe.js
│       │   │   │   ├── http.js
│       │   │   │   ├── ini.js
│       │   │   │   ├── java.js
│       │   │   │   ├── javascript.js
│       │   │   │   ├── json.js
│       │   │   │   ├── lasso.js
│       │   │   │   ├── lisp.js
│       │   │   │   ├── livecodeserver.js
│       │   │   │   ├── lua.js
│       │   │   │   ├── makefile.js
│       │   │   │   ├── markdown.js
│       │   │   │   ├── mathematica.js
│       │   │   │   ├── matlab.js
│       │   │   │   ├── mel.js
│       │   │   │   ├── mizar.js
│       │   │   │   ├── monkey.js
│       │   │   │   ├── nginx.js
│       │   │   │   ├── nimrod.js
│       │   │   │   ├── nix.js
│       │   │   │   ├── nsis.js
│       │   │   │   ├── objectivec.js
│       │   │   │   ├── ocaml.js
│       │   │   │   ├── oxygene.js
│       │   │   │   ├── parser3.js
│       │   │   │   ├── perl.js
│       │   │   │   ├── php.js
│       │   │   │   ├── profile.js
│       │   │   │   ├── protobuf.js
│       │   │   │   ├── python.js
│       │   │   │   ├── r.js
│       │   │   │   ├── rib.js
│       │   │   │   ├── rsl.js
│       │   │   │   ├── ruby.js
│       │   │   │   ├── ruleslanguage.js
│       │   │   │   ├── rust.js
│       │   │   │   ├── scala.js
│       │   │   │   ├── scilab.js
│       │   │   │   ├── scss.js
│       │   │   │   ├── smalltalk.js
│       │   │   │   ├── sql.js
│       │   │   │   ├── swift.js
│       │   │   │   ├── tex.js
│       │   │   │   ├── thrift.js
│       │   │   │   ├── typescript.js
│       │   │   │   ├── vala.js
│       │   │   │   ├── vbnet.js
│       │   │   │   ├── vbscript.js
│       │   │   │   ├── vhdl.js
│       │   │   │   ├── vim.js
│       │   │   │   ├── x86asm.js
│       │   │   │   └── xml.js
│       │   │   └── styles/
│       │   │       ├── arta.css
│       │   │       ├── ascetic.css
│       │   │       ├── atelier-dune.dark.css
│       │   │       ├── atelier-dune.light.css
│       │   │       ├── atelier-forest.dark.css
│       │   │       ├── atelier-forest.light.css
│       │   │       ├── atelier-heath.dark.css
│       │   │       ├── atelier-heath.light.css
│       │   │       ├── atelier-lakeside.dark.css
│       │   │       ├── atelier-lakeside.light.css
│       │   │       ├── atelier-seaside.dark.css
│       │   │       ├── atelier-seaside.light.css
│       │   │       ├── brown_paper.css
│       │   │       ├── codepen-embed.css
│       │   │       ├── color-brewer.css
│       │   │       ├── dark.css
│       │   │       ├── default.css
│       │   │       ├── docco.css
│       │   │       ├── far.css
│       │   │       ├── foundation.css
│       │   │       ├── github.css
│       │   │       ├── googlecode.css
│       │   │       ├── hybrid.css
│       │   │       ├── idea.css
│       │   │       ├── ir_black.css
│       │   │       ├── kimbie.dark.css
│       │   │       ├── kimbie.light.css
│       │   │       ├── magula.css
│       │   │       ├── mono-blue.css
│       │   │       ├── monokai.css
│       │   │       ├── monokai_sublime.css
│       │   │       ├── obsidian.css
│       │   │       ├── paraiso.dark.css
│       │   │       ├── paraiso.light.css
│       │   │       ├── pojoaque.css
│       │   │       ├── railscasts.css
│       │   │       ├── rainbow.css
│       │   │       ├── school_book.css
│       │   │       ├── solarized_dark.css
│       │   │       ├── solarized_light.css
│       │   │       ├── sunburst.css
│       │   │       ├── tomorrow-night-blue.css
│       │   │       ├── tomorrow-night-bright.css
│       │   │       ├── tomorrow-night-eighties.css
│       │   │       ├── tomorrow-night.css
│       │   │       ├── tomorrow.css
│       │   │       ├── vs.css
│       │   │       ├── xcode.css
│       │   │       └── zenburn.css
│       │   ├── img.screenfull.js
│       │   ├── mixjs/
│       │   │   ├── .npmignore
│       │   │   ├── Gruntfile.js
│       │   │   ├── MIT-LICENSE.txt
│       │   │   ├── README.md
│       │   │   ├── lib/
│       │   │   │   ├── event/
│       │   │   │   │   ├── broadcast.js
│       │   │   │   │   └── wait.js
│       │   │   │   ├── mix-0.2.js
│       │   │   │   └── mix.0.3.0.js
│       │   │   ├── package.json
│       │   │   ├── research/
│       │   │   │   ├── js.php
│       │   │   │   ├── load-test.html
│       │   │   │   ├── loadjs.html
│       │   │   │   └── userAgent.html
│       │   │   └── src/
│       │   │       ├── Module.js
│       │   │       ├── Promise.js
│       │   │       ├── browser.js
│       │   │       ├── core.js
│       │   │       ├── getCurrentScript.js
│       │   │       ├── getPath.js
│       │   │       ├── intro.js
│       │   │       ├── loadcss-img.js
│       │   │       ├── loadcss.js
│       │   │       ├── loadjs.js
│       │   │       ├── outro.js
│       │   │       ├── typeof.js
│       │   │       └── vars.js
│       │   ├── nodeppt.control.js
│       │   ├── nodeppt.control.postMessage.js
│       │   ├── nodeppt.control.socket.js
│       │   ├── nodeppt.js
│       │   ├── prettify.js
│       │   ├── qrcode.js
│       │   ├── shake.js
│       │   ├── socket.io.js
│       │   └── zoom.js
│       ├── sm.htm
│       └── think-in-css.html
├── project-school/
│   ├── .project
│   ├── html/
│   │   ├── resume.html
│   │   ├── template.html
│   │   └── test.txt
│   ├── index.gtml
│   ├── index.html
│   ├── js/
│   │   ├── angular.js
│   │   ├── controllers.js
│   │   ├── index.js
│   │   └── tool.js
│   └── themes/
│       ├── default/
│       │   ├── accordion.css
│       │   ├── calendar.css
│       │   ├── combo.css
│       │   ├── combobox.css
│       │   ├── datagrid.css
│       │   ├── datebox.css
│       │   ├── dialog.css
│       │   ├── easyui.css
│       │   ├── layout.css
│       │   ├── linkbutton.css
│       │   ├── menu.css
│       │   ├── menubutton.css
│       │   ├── messager.css
│       │   ├── pagination.css
│       │   ├── panel.css
│       │   ├── progressbar.css
│       │   ├── propertygrid.css
│       │   ├── searchbox.css
│       │   ├── slider.css
│       │   ├── spinner.css
│       │   ├── splitbutton.css
│       │   ├── tabs.css
│       │   ├── tooltip.css
│       │   ├── tree.css
│       │   ├── validatebox.css
│       │   └── window.css
│       └── icon.css
├── sitemap.xml
├── tags.html
├── theme-setup.md
└── works/
    ├── css/
    │   ├── common.css
    │   └── home.css
    ├── demo/
    │   ├── 03/
    │   │   ├── bd03.html
    │   │   └── css/
    │   │       └── main.css
    │   ├── 04/
    │   │   ├── css/
    │   │   │   ├── main.css
    │   │   │   └── r.css
    │   │   ├── data.js
    │   │   └── index.html
    │   ├── 06/
    │   │   ├── css/
    │   │   │   └── main.css
    │   │   └── index.html
    │   ├── 07/
    │   │   ├── css/
    │   │   │   └── main.css
    │   │   └── index.html
    │   ├── 08/
    │   │   ├── css/
    │   │   │   └── main.css
    │   │   └── index.html
    │   ├── ali/
    │   │   ├── actor.html
    │   │   ├── file/
    │   │   │   ├── abtest1120.css
    │   │   │   ├── ac_base.js
    │   │   │   ├── ac_retina.js
    │   │   │   ├── aliyun_core.js
    │   │   │   ├── aplus_v2.js
    │   │   │   ├── base.css
    │   │   │   ├── browserdetect.js
    │   │   │   ├── btm.v.3.css
    │   │   │   ├── event_mixins.js
    │   │   │   ├── header_footer.css
    │   │   │   ├── index.js
    │   │   │   ├── index_2.css
    │   │   │   ├── index_3.css
    │   │   │   ├── jquery.fullbg.js
    │   │   │   ├── organictabs.jquery.js
    │   │   │   ├── overview.css
    │   │   │   ├── overview.js
    │   │   │   ├── owl.carousel.js
    │   │   │   ├── pb_v.0.0.js
    │   │   │   ├── prototype.js
    │   │   │   ├── reveal.css
    │   │   │   ├── s_code_h.js
    │   │   │   ├── saved_resource
    │   │   │   ├── sizzle.js
    │   │   │   ├── swap_view.js
    │   │   │   └── yun4.htm
    │   │   └── startmove.js
    │   ├── d3/
    │   │   ├── d3.v3.js
    │   │   └── 新建文本文档.html
    │   ├── ee/
    │   │   ├── index.htm
    │   │   └── index_files/
    │   │       ├── analytics.js
    │   │       ├── backgroundClasses.css
    │   │       ├── dataset-shim.js
    │   │       ├── default-reset.css
    │   │       ├── default.css
    │   │       ├── impress.js
    │   │       ├── loadPresentation.js
    │   │       ├── main.css
    │   │       ├── onready.js
    │   │       ├── surfaceClasses.css
    │   │       └── web-fonts.css
    │   ├── html5/
    │   │   └── ali.html
    │   ├── qqzone-img/
    │   │   └── index.html
    │   ├── sm-meituan/
    │   │   ├── index.html
    │   │   └── main.css
    │   └── stream/
    │       ├── data.js
    │       ├── data2.js
    │       ├── float.html
    │       └── position.html
    ├── index.html
    ├── index_v1.html
    ├── index_v2.html
    ├── js/
    │   ├── data.js
    │   ├── index.js
    │   └── lib/
    │       ├── angular-1.3.0.js
    │       ├── angular-animate.js
    │       ├── angular-route.js
    │       ├── angular-ui-router.js
    │       ├── jquery.js
    │       └── ui-bootstrap-tpls-0.11.0.js
    ├── main.html
    └── template/
        ├── about.html
        ├── show-m.html
        └── show.html

================================================
FILE CONTENTS
================================================

================================================
FILE: .gitignore
================================================
_site
.DS_Store
*.sublime-project
*.sublime-workspace
codekit-config.json
node_modules
Gemfile.lock

================================================
FILE: .jshintrc
================================================
{
  "bitwise": true,
  "browser": true,
  "curly": true,
  "eqeqeq": true,
  "eqnull": true,
  "es5": false,
  "esnext": true,
  "immed": true,
  "jquery": true,
  "latedef": true,
  "newcap": true,
  "noarg": true,
  "node": true,
  "strict": false,
  "trailing": false,
  "undef": true,
  "multistr": true,
  "expr": true
}

================================================
FILE: .project
================================================
<?xml version="1.0" encoding="UTF-8"?>
<projectDescription>
	<name>github_blog</name>
	<comment></comment>
	<projects>
	</projects>
	<buildSpec>
		<buildCommand>
			<name>com.aptana.ide.core.unifiedBuilder</name>
			<arguments>
			</arguments>
		</buildCommand>
	</buildSpec>
	<natures>
		<nature>com.aptana.projects.webnature</nature>
	</natures>
</projectDescription>


================================================
FILE: 404.md
================================================
---
layout: page
title: "Page Not Found"
description: "Page not found. Your pixels are in another canvas."
---  

Sorry, but the page you were trying to view does not exist --- perhaps you can try searching for it below.

<script type="text/javascript">
  var GOOG_FIXURL_LANG = 'en';
  var GOOG_FIXURL_SITE = '{{ site.url }}'
</script>
<script type="text/javascript"
  src="http://linkhelp.clients.google.com/tbproxy/lh/wm/fixurl.js">
</script>

================================================
FILE: CNAME
================================================



================================================
FILE: Gemfile
================================================
source 'https://rubygems.org'

gem 'jekyll'
gem 'kramdown'
gem 'coderay'
gem 'rake'
gem 'thor'
gem 'activesupport'
gem 'stringex'

================================================
FILE: Gruntfile.js
================================================
'use strict';
module.exports = function(grunt) {

  grunt.initConfig({
    jshint: {
      options: {
        jshintrc: '.jshintrc'
      },
      all: [
        'Gruntfile.js',
        'assets/js/*.js',
        'assets/js/plugins/*.js',
        '!assets/js/scripts.min.js'
      ]
    },
    recess: {
      dist: {
        options: {
          compile: true,
          compress: true
        },
        files: {
          'assets/css/main.min.css': [
            'assets/less/main.less'
          ]
        }
      },
      dev: {
        options: {
          compile: true,
          compress: false
        },
        files: {
          'assets/css/main.css': [
            'assets/less/main.less'
          ]
        }
      }
    },
    uglify: {
      dist: {
        files: {
          'assets/js/scripts.min.js': [
            'assets/js/plugins/*.js',
            'assets/js/_*.js'
          ]
        }
      }
    },
    imagemin: {
      dist: {
        options: {
          optimizationLevel: 7,
          progressive: true
        },
        files: [{
          expand: true,
          cwd: 'images/',
          src: '{,*/}*.{png,jpg,jpeg}',
          dest: 'images/'
        }]
      }
    },
    svgmin: {
      dist: {
        files: [{
          expand: true,
          cwd: 'images/',
          src: '{,*/}*.svg',
          dest: 'images/'
        }]
      }
    },
    watch: {
      less: {
        files: [
          'assets/less/*.less',
          'assets/less/bootstrap/*.less'
        ],
        tasks: ['recess']
      },
      js: {
        files: [
          '<%= jshint.all %>'
        ],
        tasks: ['jshint','uglify']
      }
    },
    clean: {
      dist: [
        'assets/css/main.min.css',
        'assets/js/scripts.min.js'
      ]
    }
  });

  // Load tasks
  grunt.loadNpmTasks('grunt-contrib-clean');
  grunt.loadNpmTasks('grunt-contrib-jshint');
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-recess');
  grunt.loadNpmTasks('grunt-contrib-imagemin');
  grunt.loadNpmTasks('grunt-svgmin');

  // Register tasks
  grunt.registerTask('default', [
    'clean',
    'recess',
    'uglify',
    'imagemin',
    'svgmin'
  ]);
  grunt.registerTask('dev', [
    'watch'
  ]);

};

================================================
FILE: LICENSE
================================================
The MIT License (MIT)

Copyright (c) 2014 Michael Rose

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

================================================
FILE: README.md
================================================
个人前端博客
----------

## [点此访问 www.hacke2.cn](http://www.hacke2.cn)

本博客是基于[hpstr jekyll]("https://github.com/hacke2/hpstr-jekyll-theme)而搭建的个人博客,在原有强大的功能上,做了如下修改:

* 将google cdn换成 baidu cdn 原因你懂的
* 去掉分享到twitter、facebook等国外社区,加入百度分享
* 加入百度站长助手,方便您的统计
* disqus评论
* Read More功能,不想像以前一样文章全显示出来

如果您想快速搭建和我一样属于自己的博客系统,请参阅:

[30秒创建Github Page](http://www.hacke2.cn/create-github-page/)

目前待优化事项:

* 合并资源(JS,CSS)





================================================
FILE: Rakefile.rb
================================================
require "rubygems"
require "bundler/setup"
require "stringex"

## -- Config -- ##

public_dir      = "public"    # compiled site directory
posts_dir       = "_posts"    # directory for blog files
new_post_ext    = "md"  # default new post file extension when using the new_post task
new_page_ext    = "md"  # default new page file extension when using the new_page task


#############################
# Create a new Post or Page #
#############################

# usage rake new_post
desc "Create a new post in #{posts_dir}"
task :new_post, :title do |t, args|
  if args.title
    title = args.title
  else
    title = get_stdin("Enter a title for your post: ")
  end
  filename = "#{posts_dir}/#{Time.now.strftime('%Y-%m-%d')}-#{title.to_url}.#{new_post_ext}"
  if File.exist?(filename)
    abort("rake aborted!") if ask("#{filename} already exists. Do you want to overwrite?", ['y', 'n']) == 'n'
  end
  tags = get_stdin("Enter tags to classify your post (comma separated): ")
  puts "Creating new post: #{filename}"
  open(filename, 'w') do |post|
    post.puts "---"
    post.puts "layout: post"
    post.puts "title: \"#{title.gsub(/&/,'&amp;')}\""
    post.puts "modified: #{Time.now.strftime('%Y-%m-%d %H:%M:%S %z')}"
    post.puts "tags: [#{tags}]"
    post.puts "image:"
    post.puts "  feature: "
    post.puts "  credit: "
    post.puts "  creditlink: "
    post.puts "comments: "
    post.puts "share: "
    post.puts "---"
  end
end

# usage rake new_page
desc "Create a new page"
task :new_page, :title do |t, args|
  if args.title
    title = args.title
  else
    title = get_stdin("Enter a title for your page: ")
  end
  filename = "#{title.to_url}.#{new_page_ext}"
  if File.exist?(filename)
    abort("rake aborted!") if ask("#{filename} already exists. Do you want to overwrite?", ['y', 'n']) == 'n'
  end
  tags = get_stdin("Enter tags to classify your page (comma separated): ")
  puts "Creating new page: #{filename}"
  open(filename, 'w') do |page|
    page.puts "---"
    page.puts "layout: page"
    page.puts "permalink: /#{title.to_url}/"
    page.puts "title: \"#{title}\""
    page.puts "modified: #{Time.now.strftime('%Y-%m-%d %H:%M')}"
    page.puts "tags: [#{tags}]"
    page.puts "image:"
    page.puts "  feature: "
    page.puts "  credit: "
    page.puts "  creditlink: "
    page.puts "share: "
    page.puts "---"
  end
end

def get_stdin(message)
  print message
  STDIN.gets.chomp
end

def ask(message, valid_options)
  if valid_options
    answer = get_stdin("#{message} #{valid_options.to_s.gsub(/"/, '').gsub(/, /,'/')} ") while !valid_options.include?(answer)
  else
    answer = get_stdin(message)
  end
  answer
end

================================================
FILE: _config.yml
================================================
title:            hacke2's blog
description:      hacke2的前端技术博客,分享自己的技术心得,积累前段技能,汇聚前端之路的点点滴滴。
disqus_shortname: hacke2
reading_time:     true
words_per_minute: 200
#Your site's domain goes here. Leave localhost server or blank when working locally.
url:              http://www.hacke2.cn

# Owner/author information
owner:
  name:           hacke2
  avatar:         wxl-photo2.jpg
  bio:            "梦想还是要有的,万一实现了呢?"
  email:          hacke2@qq.com
  # Social networking links used in footer. Update and remove as you like.
  twitter:        
  facebook:       
  github: hacke2         
  stackexchange:  
  linkedin:       
  instagram:      
  flickr:         
  tumblr:         
  # For Google Authorship https://plus.google.com/authorship
  # google plus id, include the '+', eg +mmistakes
  google_plus:    +yourid

# Background image to be tiled on all pages
background: 

# Analytics and webmaster tools stuff goes here
google_analytics:   
google_verify:      
# https://ssl.bing.com/webmaster/configure/verify/ownership Option 2 content= goes here
bing_verify:         

# Links to include in top navigation
# For external links add external: true
links:
#  - title: Theme Setup
#    url: /theme-setup
  - title: Works
    url: http://www.hacke2.cn/works
    external: true
#  - title: GitHub
#    url: https://github.com/hacke2
#    external: true
    

# http://en.wikipedia.org/wiki/List_of_tz_database_time_zones
timezone:    America/New_York
future:      true
highlighter: rouge
markdown:    kramdown

# https://github.com/mojombo/jekyll/wiki/Permalinks
permalink:   /:categories/:title/

# Amount of post to show on home page
paginate: 5

kramdown:
  auto_ids: true
  footnote_nr: 1
  entity_output: as_char
  toc_levels: 1..6
  use_coderay: true

  coderay:
    coderay_line_numbers: nil
    coderay_line_numbers_start: 1
    coderay_tab_width: 4
    coderay_bold_every: 10
    coderay_css: class

include: [".htaccess"]
exclude: ["lib", "config.rb", "Capfile", "config", "Gemfile", "Gemfile.lock", "README.md", "LICENSE", "log", "Rakefile", "Rakefile.rb", "tmp", "less", "*.sublime-project", "*.sublime-workspace", "test", "spec", "Gruntfile.js", "package.json", "node_modules"]

================================================
FILE: _includes/browser-upgrade.html
================================================
<!--[if lt IE 9]><div class="upgrade"><strong><a href="http://whatbrowser.org/">Your browser is quite old!</strong> Why not upgrade to a different browser to better enjoy this site?</a></div><![endif]-->

================================================
FILE: _includes/disqus_comments.html
================================================
<script type="text/javascript">
    /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
    var disqus_shortname = '{{ site.disqus_shortname }}'; // required: replace example with your forum shortname

    /* * * DON'T EDIT BELOW THIS LINE * * */
    (function() {
        var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
        dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
    })();

    /* * * DON'T EDIT BELOW THIS LINE * * */
    (function () {
        var s = document.createElement('script'); s.async = true;
        s.type = 'text/javascript';
        s.src = '//' + disqus_shortname + '.disqus.com/count.js';
        (document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
    }());
</script>
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
<a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>

================================================
FILE: _includes/footer.html
================================================
<span>&copy; {{ site.time | date: '%Y' }} {{ site.owner.name }}. Powered by <a href="http://jekyllrb.com">Jekyll</a> using the <a href="http://mademistakes.com/hpstr/">HPSTR Theme</a>.</span>
<!--
	作者:hacke2@qq.com
	时间:2014-08-31
	描述:百度统计
-->
<script type="text/javascript">
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Fc974ee5652cef49d5c272e5cae5a0d20' type='text/javascript'%3E%3C/script%3E"));
</script>


================================================
FILE: _includes/head.html
================================================
<meta charset="utf-8">
<title>{% if page.title %}{{ page.title }} &#8211; {% endif %}{{ site.title }}</title>
<meta name="description" content="{% if page.description %}{{ page.description }}{% else %}{{ site.description }}{% endif %}">
{% if page.tags %}<meta name="keywords" content="{{ page.tags | join: ', ' }}">{% endif %}

{% if site.owner.twitter %}<!-- Twitter Cards -->
{% if page.image.feature %}<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image" content="{{ site.url }}/images/{{ page.image.feature }}">
{% else %}<meta name="twitter:card" content="summary">
<meta name="twitter:image" content="{% if page.image.thumb %}{{ site.url }}/images/{{ page.image.thumb }}{% else %}{{ site.url }}/images/{{ site.logo }}{% endif %}">{% endif %}
<meta name="twitter:title" content="{% if page.title %}{{ page.title }}{% else %}{{ site.title }}{% endif %}">
<meta name="twitter:description" content="{% if page.description %}{{ page.description }}{% else %}{{ site.description }}{% endif %}">
<meta name="twitter:creator" content="@{{ site.owner.twitter }}">{% endif %}
 <meta name="baidu-site-verification" content="QkAp0TlPXW" />
<!-- Open Graph -->
<meta property="og:locale" content="en_US">
<meta property="og:type" content="article">
<meta property="og:title" content="{% if page.title %}{{ page.title }}{% else %}{{ site.title }}{% endif %}">
<meta property="og:description" content="{% if page.description %}{{ page.description }}{% else %}{{ site.description }}{% endif %}">
<meta property="og:url" content="{{ site.url }}{{ page.url }}">
<meta property="og:site_name" content="{{ site.title }}">

{% if site.google_verify %}<meta name="google-site-verification" content="{{ site.google_verify }}">{% endif %}
{% if site.bing_verify %}<meta name="msvalidate.01" content="{{ site.bing_verify }}">{% endif %}

{% capture canonical %}{{ site.url }}{% if site.permalink contains '.html' %}{{ page.url }}{% else %}{{ page.url | remove:'index.html' | strip_slash }}{% endif %}{% endcapture %}
<link rel="canonical" href="{{ canonical }}">
<link href="{{ site.url }}/feed.xml" type="application/atom+xml" rel="alternate" title="{{ site.title }} Feed">
<!--{% if site.owner.google_plus %}<link rel="author" href="https://google.com/{{ site.owner.google_plus }}?rel=author">{% endif %}
-->
<!-- http://t.co/dKP3o1e -->
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320">
<meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>

<!-- For all browsers -->
<link rel="stylesheet" href="{{ site.url }}/assets/css/main.min.css">
<!-- Webfonts 
<link href="http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic" rel="stylesheet" type="text/css">
-->
<meta http-equiv="cleartype" content="on">

<!-- Load Modernizr -->
<script src="{{ site.url }}/assets/js/vendor/modernizr-2.6.2.custom.min.js"></script>

<!-- Icons -->
<!-- 16x16 -->
<link rel="shortcut icon" href="{{ site.url }}/favicon.ico">
<!-- 32x32 -->
<link rel="shortcut icon" href="{{ site.url }}/favicon.png">
<!-- 57x57 (precomposed) for iPhone 3GS, pre-2011 iPod Touch and older Android devices -->
<link rel="apple-touch-icon-precomposed" href="{{ site.url }}/images/apple-touch-icon-precomposed.png">
<!-- 72x72 (precomposed) for 1st generation iPad, iPad 2 and iPad mini -->
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="{{ site.url }}/images/apple-touch-icon-72x72-precomposed.png">
<!-- 114x114 (precomposed) for iPhone 4, 4S, 5 and post-2011 iPod Touch -->
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="{{ site.url }}/images/apple-touch-icon-114x114-precomposed.png">
<!-- 144x144 (precomposed) for iPad 3rd and 4th generation -->
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="{{ site.url }}/images/apple-touch-icon-144x144-precomposed.png">

{% if page.image.background or site.background %}
{% capture background %}{% if page.image.background %}{{ page.image.background }}{% else %}{{ site.background }}{% endif %}{% endcapture %}
{% unless background contains 'http://' or background contains 'https://' %}{% capture background %}{{ site.url }}/images/{{ background }}{% endcapture %}{% endunless %}
<style type="text/css">body {background-image:url({{ background }});}</style>
{% endif %}


================================================
FILE: _includes/navigation.html
================================================
<nav id="dl-menu" class="dl-menuwrapper" role="navigation">
	<button class="dl-trigger">Open Menu</button>
	<ul class="dl-menu">
		<li><a href="{{ site.url }}">Home</a></li>
		<li>
			<a href="#">About</a>
			<ul class="dl-submenu">
				<li>
					<img src="{{ site.url }}/images/{{ site.owner.avatar }}" alt="{{ site.owner.name }} photo" class="author-photo">
					<h4>{{ site.owner.name }}</h4>
					<p>{{ site.owner.bio }}</p>
				</li>
				<!--关于我 TODO-->
				<li><a href="{{ site.url }}/about/">Learn More</a></li>
				{% if site.owner.email %}<li>
					<a href="mailto:{{ site.owner.email }}"><i class="fa fa-envelope"></i> Email</a>
				</li>{% endif %}
				{% if site.owner.twitter %}<li>
					<a href="http://twitter.com/{{ site.owner.twitter }}"><i class="fa fa-twitter"></i> Twitter</a>
				</li>{% endif %}
				{% if site.owner.facebook %}<li>
					<a href="http://facebook.com/{{ site.owner.facebook }}"><i class="fa fa-facebook"></i> Facebook</a>
				</li>{% endif %}
				{% if site.owner.google_plus %}<li>
					<!--<a href="https://google.com/{{ site.owner.google_plus }}"><i class="fa fa-google-plus"></i> Google+</a>-->
				</li>{% endif %}
				{% if site.owner.linkedin %}<li>
					<a href="http://linkedin.com/in/{{ site.owner.linkedin }}"><i class="fa fa-linkedin"></i> LinkedIn</a>
				</li>{% endif %}
				{% if site.owner.github %}<li>
					<a href="http://github.com/{{ site.owner.github }}"><i class="fa fa-github"></i> GitHub</a>
				</li>{% endif %}
				{% if site.owner.stackexchange %}<li>
					<a href="{{ site.owner.stackexchange }}"><i class="fa fa-stack-exchange"></i> Stackexchange</a>
				</li>{% endif %}
				{% if site.owner.instagram %}<li>
					<a href="http://instagram.com/{{ site.owner.instagram }}"><i class="fa fa-instagram"></i> Instagram</a>
				</li>{% endif %}
				{% if site.owner.flickr %}<li>
					<a href="http://www.flickr.com/photos/{{ site.owner.flickr }}"><i class="fa fa-flickr"></i> Flickr</a>
				</li>{% endif %}
				{% if site.owner.tumblr %}<li>
					<a href="http://{{ site.owner.tumblr }}.tumblr.com"><i class="fa fa-tumblr"></i> Tumblr</a>
				</li>{% endif %}
			</ul><!-- /.dl-submenu -->
		</li>
		<li>
			<a href="#">Posts</a>
			<ul class="dl-submenu">
				<li><a href="{{ site.url }}/posts/">All Posts</a></li>
				<li><a href="{{ site.url }}/tags/">All Tags</a></li>
			</ul>
		</li>
		{% for link in site.links %}<li>{% if link.external %}<a href="{{ link.url }}" target="_blank">{{ link.title }}</a>{% else %}<a href="{{ site.url }}{{ link.url }}">{{ link.title }}</a>{% endif %}</li>{% endfor %}
	</ul><!-- /.dl-menu -->
</nav><!-- /.dl-menuwrapper -->


================================================
FILE: _includes/scripts.html
================================================
<script src="//libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<!--<script>window.jQuery || document.write('<script src="{{ site.url }}/assets/js/vendor/jquery-1.9.1.min.js"><\/script>')</script>-->
<script src="{{ site.url }}/assets/js/scripts.min.js"></script>
<script>window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"","bdMini":"1","bdMiniList":false,"bdPic":"","bdStyle":"0","bdSize":"16"},"share":{}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];</script>
{% if site.google_analytics %}
<!-- Asynchronous Google Analytics snippet -->
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', '{{ site.google_analytics }}', 'auto');  
  ga('require', 'linkid', 'linkid.js');
  ga('send', 'pageview');
  
</script>
{% endif %}
{% if page.comments %}{% include disqus_comments.html %}{% endif %}

================================================
FILE: _layouts/page.html
================================================
<!doctype html>
<!--[if lt IE 7]><html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if (IE 7)&!(IEMobile)]><html class="no-js lt-ie9 lt-ie8" lang="en"><![endif]-->
<!--[if (IE 8)&!(IEMobile)]><html class="no-js lt-ie9" lang="en"><![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"><!--<![endif]-->
<head>
{% include head.html %}
</head>

<body id="page" {% if page.image.feature %}class="feature"{% endif %}>

{% include browser-upgrade.html %}
{% include navigation.html %}

{% if page.image.feature %}
<div class="entry-header">
  <!--{% if page.image.credit %}<div class="image-credit">Image source: <a href="{{ page.image.creditlink }}">{{ page.image.credit }}</a></div>/.image-credit{% endif %}-->
  <div class="entry-image">
    <img src="{{ site.url }}/images/{{ page.image.feature }}" alt="{{ page.title }}">
  </div><!-- /.entry-image -->
</div><!-- /.entry-header -->
{% endif %}

<div id="main" role="main">
  <article class="entry">
    <header class="header-title">
      <div class="header-title-wrap">
        <h1 class="entry-title">{{ page.title }}</h1>
        {% if site.reading_time %}
        <p class="entry-reading-time">
          <i class="fa fa-clock-o"></i>
          {% assign readtime = content | number_of_words | divided_by:site.words_per_minute %}
          Reading time ~{% if readtime <= 1 %}1 minute{% else %}{{ readtime }} minutes{% endif %}
        </p><!-- /.entry-reading-time -->
        {% endif %}
      </div><!-- /.header-title-wrap -->
    </header>
    <div class="entry-content">
      {{ content }}
      <footer class="entry-meta">
        {% if page.modified %}{{ page.title }} was last modified on <span class="entry-date date modified"><time datetime="{{ page.modified }}">{{ page.modified }}</time></span>
        <span class="author vcard fn">{{ site.owner.name }}</span>{% endif %}
        {% if page.share %}<div class="social-share">
          <ul class="socialcount socialcount-small inline-list" data-url="{{ site.url }}{{ page.url }}" data-share-text="{{ page.title }}">
            <li class="facebook"><a href="https://www.facebook.com/sharer/sharer.php?u={{ site.url }}{{ page.url }}" title="Share on Facebook"><span class="count"><i class="fa fa-facebook-square"></i> Like</span></a></li>
            <li class="twitter"><a href="https://twitter.com/intent/tweet?text={{ site.url }}{{ page.url }}" title="Share on Twitter"><span class="count"><i class="fa fa-twitter-square"></i> Tweet</span></a></li>
            <li class="googleplus"><a href="https://plus.google.com/share?url={{ site.url }}{{ page.url }}" title="Share on Google Plus"><span class="count"><i class="fa fa-google-plus-square"></i> +1</span></a></li>
          </ul>
        </div><!-- /.social-share -->{% endif %}
      </footer>
    </div><!-- /.entry-content -->
    {% if site.disqus_shortname and page.comments %}<section id="disqus_thread"></section><!-- /#disqus_thread -->{% endif %}
  </article>
</div><!-- /#main -->

<div class="footer-wrapper">
  <footer role="contentinfo">
    {% include footer.html %}
  </footer>
</div><!-- /.footer-wrapper -->

{% include scripts.html %}          

</body>
</html>


================================================
FILE: _layouts/post-index.html
================================================
<!doctype html>
<!--[if lt IE 7]><html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if (IE 7)&!(IEMobile)]><html class="no-js lt-ie9 lt-ie8" lang="en"><![endif]-->
<!--[if (IE 8)&!(IEMobile)]><html class="no-js lt-ie9" lang="en"><![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"><!--<![endif]-->
<head>
{% include head.html %}
</head>

<body id="post-index" {% if page.image.feature %}class="feature"{% endif %}>

{% include browser-upgrade.html %}
{% include navigation.html %}
<div class="entry-header">
  <!--{% if page.image.credit %}<div class="image-credit">Image source: <a href="{{ page.image.creditlink }}">{{ page.image.credit }}</a></div>/.image-credit{% endif %}-->
  {% if page.image.feature %}
    <div class="entry-image">
      <img id="headerPic">
    </div><!-- /.entry-image -->
  {% endif %}
  <div class="header-title">
    <div class="header-title-wrap">
      <h1>{{ site.title }}</h1>
      <h2>{{ page.title }}</h2>
    </div><!-- /.header-title-wrap -->
  </div><!-- /.header-title -->
  <span id="headerPicDesc" style="position:absolute;right:5px;bottom:5px;color:rgb(204, 194, 194)"></span>
</div><!-- /.entry-header -->
<script type="text/javascript">
  var picData = [{
    src : '/images/fuzhou-min.jpg',
    desc : '2012.10.4 福州·平潭 第一次看见大海'
  },{
    src : '/images/shiyanshi.jpg',
    desc : '2013.10.26 从实验室的角度看整个校园'
  },{
    src : '/images/huoyin.jpg',
    desc : '谢谢你 陪伴了我10年的火影!'
  }],
  picIndex = ((new Date).getMonth() +1) % picData.length,
  curDate = picData[picIndex],
  headerPic = document.getElementById('headerPic'),
  headerPicDesc = document.getElementById('headerPicDesc');

  headerPic.setAttribute('src', curDate.src);    
  headerPicDesc.innerHTML = curDate.desc;    
</script>
<div id="main" role="main">
  {{ content }}
</div><!-- /#main -->

<div class="footer-wrapper">
  <footer role="contentinfo">
    {% include footer.html %}
  </footer>
</div><!-- /.footer-wrapper -->

{% include scripts.html %}          

</body>
</html>

================================================
FILE: _layouts/post.html
================================================
<!doctype html>
<!--[if lt IE 7]><html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if (IE 7)&!(IEMobile)]><html class="no-js lt-ie9 lt-ie8" lang="en"><![endif]-->
<!--[if (IE 8)&!(IEMobile)]><html class="no-js lt-ie9" lang="en"><![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"><!--<![endif]-->
<head>
{% include head.html %}
</head>

<body id="post" {% if page.image.feature %}class="feature"{% endif %}>

{% include browser-upgrade.html %}
{% include navigation.html %}

{% if page.image.feature %}
<div class="entry-header">
  <!--{% if page.image.credit %}<div class="image-credit">Image source: {% if page.image.creditlink %}<a href="{{ page.image.creditlink }}">{% endif %}{{ page.image.credit }}{% if page.image.creditlink %}</a>{% endif %}</div>/.image-credit{% endif %}-->
  <div class="entry-image">
    <img src="{{ site.url }}/images/{{ page.image.feature }}" alt="{{ page.title }}">
  </div><!-- /.entry-image -->
</div><!-- /.entry-header -->
{% endif %}

<div id="main" role="main">
  <article class="hentry">
    <header class="header-title">
      <div class="header-title-wrap">
        {% if page.link %}
          <h1 class="entry-title"><a href="{{ page.link }}">{{ page.title }}</a></h1>
        {% else %}
          <h1 class="entry-title"><a href="{{ site.url }}{{ page.url }}" rel="bookmark" title="{{ page.title }}">{{ page.title }}</a></h1>
        {% endif %}
        <h2>{{ page.date | date: "%B %d, %Y" }}</h2>
        {% if site.reading_time %}
        <p class="entry-reading-time">
          <i class="fa fa-clock-o"></i>
          {% assign readtime = content | number_of_words | divided_by:site.words_per_minute %}
          Reading time ~{% if readtime <= 1 %}1 minute{% else %}{{ readtime }} minutes{% endif %}
        </p><!-- /.entry-reading-time -->
        {% endif %}
      </div><!-- /.header-title-wrap -->
    </header>
    <div class="entry-content">
      {{ content }}
      <footer class="entry-meta">
        <span class="entry-tags">{% for tag in page.tags %}<a href="{{ site.url }}/tags/#{{ tag }}" title="Pages tagged {{ tag }}" class="tag">{{ tag }}</a>{% unless forloop.last %}{% endunless %}{% endfor %}</span>
        <span><a href="{{ site.url }}{{ page.url }}" rel="bookmark" title="{{ page.title }}">{{ page.title }}</a> was published on <span class="entry-date date published updated"><time datetime="{{ page.date | date_to_xmlschema }}">{{ page.date | date: "%B %d, %Y" }}</time></span></span>
        {% if page.modified %}(revised: <span class="entry-date date modified"><time datetime="{{ page.modified }}">{{ page.modified | date: "%m/%d/%Y" }}</time></span>){% endif %}
        <span class="author vcard"><span class="fn"><a href="{{ site.url }}/about/" title="About {{ site.owner.name }}">{{ site.owner.name }}</a></span></span>
        {% if page.share %}
        <div class="social-share socialcount socialcount-small inline-list">
         <ul class="bdsharebuttonbox">
         	<li><a href="#" class="bds_more" data-cmd="more"></a></li>
         	<li><a href="#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a></li>
         	<li><a href="#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博"></a></li>
         	<li><a href="#" class="bds_tqq" data-cmd="tqq" title="分享到腾讯微博"></a></li>
         	<li><a href="#" class="bds_renren" data-cmd="renren" title="分享到人人网"></a></li>
         	<li><a href="#" class="bds_weixin" data-cmd="weixin" title="分享到微信"></a></li>
         </div>
        </div><!-- /.social-share -->{% endif %}
      </footer>
    </div><!-- /.entry-content -->
    {% if site.disqus_shortname and page.comments %}<section id="disqus_thread"></section><!-- /#disqus_thread -->{% endif %}
    {% if site.related_posts.size %}
    <div class="read-more">
      {% for post in site.related_posts limit:1 %}
        <div class="read-more-header">
          <a href="{{ site.url }}{{ page.previous.url }}" class="read-more-btn">Read More</a>
        </div><!-- /.read-more-header -->
        <div class="read-more-content">
          <h3><a href="{{ site.url }}{{ post.url }}" title="{{ post.title }}">{{ post.title }}</a></h3>
          <p>{% if post.description %}{{ post.description }}{% else %}{{ post.content | strip_html | strip_newlines | truncate: 140 }}&hellip;{% endif %} <a href="{{ site.url }}{{ post.url }}">Continue reading</a></p>
        </div><!-- /.read-more-content -->
      {% endfor %}
      <div class="read-more-list">
        {% for post in site.related_posts limit:2 offset:1 %}
          <div class="list-item">
            <h4><a href="{{ site.url }}{{ post.url }}" title="{{ post.title }}">{{ post.title }}</a></h4>
            <span>Published on {{ post.date | date: "%B %d, %Y" }}</span>
          </div><!-- /.list-item -->
        {% endfor %}
      </div><!-- /.read-more-list -->
      {% endif %}
    </div><!-- /.read-more -->
  </article>
</div><!-- /#main -->

<div class="footer-wrapper">
  <footer role="contentinfo">
    {% include footer.html %}
  </footer>
</div><!-- /.footer-wrapper -->

{% include scripts.html %}	        

</body>
</html>


================================================
FILE: _posts/2014-10-1-for-me-1.html
================================================
<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>致自己</title>
		<style>
			body {
				margin: 0;
				padding: 0;
				
			}
			.container {
				width: 960px;
				margin: 0 auto;
			}
			.show-img {
				width: 500px;
				height: 400px;
				overflow:hidden;
				border: 1px solid #000000;
				position: relative;
			}
			.show-img img {
				position: relative;
			}
			.show-img .ico-long-pic {
				padding: 0 5px;
				position: absolute;
				background: #009999;
				color: #FFF;
				left: 0;
				top: 0;
				z-index: 9;
			}
			.up {
				width: 500px;
				height: 200px;
				position: absolute;
				left: 0;
				top: 0;
				opacity: 0;
				filter: Alpha(opacity=0);
				z-index: 99;
			} 
			.down {
				width: 500px;
				height: 200px;
				position: absolute;
				left: 0;
				top: 200px;
				opacity: 0;
				filter: Alpha(opacity=0);
				z-index: 99;
			} 
		</style>
	</head>

	<body>
		<div class="container">
		<p>我就是想出来看看外面的世界</p>
			<div class="show-img">
				<i class="ico-long-pic">长图</i>
				<div class="up"></div>
				<div class="down"></div>
				<img id="long-pic" src="/images/article/15.jpg" alt="" />
			</div>
		</div>
	</body>
	<script>
		var img = document.getElementById('long-pic');
		
		var context = img.parentNode;
	
		
		
		context.onmouseover = function() {
			
			var e = event || window.event,
				target = e.target || e.srcElement;
				relativeX = e.clientX - context.offsetLeft,
				relativeY = e.clientY - context.offsetTop,
				targetH = -img.offsetHeight+context.offsetHeight,
				compareH =  context.offsetHeight /2;
				
				if(target.className == 'up') {
					
					startMove(img,0);
				}
				if(target.className == 'down') {
					startMove(img,targetH);
				}
			
		}
		
		context.onmouseout = function() {
			if (img.timer) {
				clearInterval(img.timer);
			}			
		}
		
		function startMove(obj, iTarget) {
			clearInterval(obj.timer);
			
			var speed = obj.offsetTop > iTarget ? -6 : 6;
			

			obj.timer = setInterval(function(){
				if (Math.abs(iTarget - obj.offsetTop) <= Math.abs(speed)) {
					clearInterval(obj.timer);
					obj.style.top = iTarget + 'px';
				} else{
					obj.style.top = obj.offsetTop + speed + 'px';
				}
			},30);
			
		}
		
		function d(msg) {
			if(console) {
				console.log(msg);
			}
		}
	</script>

</html>


================================================
FILE: _posts/2014-10-1-mongoose-populate.md
================================================
---
layout: post
title: Mongoose简单的连表查询
description: "使用populate属性"
tags: [Mongoose]
image:
  background: witewall_3.png
comments: true
share: true
---


像我这篇文章所说的<a href="http://www.hacke2.cn/gokk/">基于Node.js + jade + Mongoose 模仿gokk.tv</a>,当时停止开发是因为我深深的感觉到当时想错了,应该用两个Schema,而不是一个下面又有数组来存,这样取数据是方便,当时分页相当麻烦,不能使用原生提供的limit方法。

今天看到一本书上有讲,尝试了一把,记录下来

我们实验的场景为一个班级有N多学生,先通过学生ID找到班级名称(是不是被玩腻了?)

先来将Schema定义好

<!--more-->

ClazzSchema : 

```js
var mongoose = require('mongoose')

var ClazzSchema = new mongoose.Schema({
	clazzName:String
})
//其他方法省略..
}

module.exports = ClazzSchema

```
    
StudentSchema : 

```js
var mongoose = require('mongoose')

var StudentSchema = new mongoose.Schema({
	name:String,
	clazzID : {
		type : mongoose.Schema.ObjectId,
		ref : 'Clazz'
	}
})

StudentSchema.statics = {
	findClazzNameByStudentId:function(studentId, callback){
			return this
				.findOne({_id : studentId}).populate('clazzID')
				.exec(callback)
		}
	//其他方法省略..
}

module.exports = StudentSchema

```

可以看到,主需要将ClazzID设为ref到Clazz,依赖为你建立Model时的名称就可以了,要查询Clzz使用populate

下面是Model

```js
var mongoose = require('mongoose')
var ClazzSchema = require('../schemas/clazzSchema')
var Clazz = mongoose.model('Clazz',ClazzSchema)


module.exports  = Clazz 
```

```js
var mongoose = require('mongoose')
var StudentSchema = require('../schemas/studentSchema')
var Student = mongoose.model('Student',StudentSchema)


module.exports  = Student 
```

大同小异,着重看test.js

```js
var mongoose = require('mongoose')
var Clazz = require('./models/clazzModel')
var Student = require('./models/studentModel')
//var db = mongoose.createConnection('localhost', 'gokk')
mongoose.connect('mongodb://localhost/test')

/*var clazz = new Clazz(
	{
		clazzName:'软件2班'
	}
);

clazz.save(function  (argument){
	console.log('true');
});*/

/*var student = new Student({
	name : 'hacke2',
	clazzID : '542b5fcc49df6e741d8d15f5'
})
student.save(function (err){
	console.log('true');
})*/

Student.findClazzNameByStudentId('542b600a683d59a80d4ee632', function (err, student){
	if(err) console.log(err);
	console.log(student.clazzID.clazzName);
})
```

之前添加了两班级:软件一班和软件二班

我们在新增hacke2时将classID设为软件2班的,查新hacke2时自动就会把关键的
Class查询到

```js
{ _id: 542b600a683d59a80d4ee632,
    name: 'hacke2',
    clazzID: { _id: 542b5fcc49df6e741d8d15f5, clazzName: '软件2班', __v: 0 },
    __v: 0 }
```
<strong>end from <a href="{{ site.url }}"> {{ site.url }}</a></strong>

================================================
FILE: _posts/2014-10-11-the-golden-key.md
================================================
---
layout: post
title: 金钥匙
description: "记这两周的起起伏伏"
tags: [心情]
image:
  background: witewall_3.png
comments: true
share: true
---

这两周的心情真是起起伏伏,本来意向是在杭州,结果被分在北京高德,经过无数个人帮我协调,换了好几个部门,最后在神马搜索。

之前根本没有遇到这个情况,以为拿到阿里offer就等于拿到了金钥匙,以后就等着那着这个钥匙去开各个宝箱,职业上专注前端,专注Node.js,带领团队,升职加薪。以后的生活肯定很美满。

这几天的事情让我细细想了一下,这种想法是错的。<strong>妄想着一劳永逸的解决自己的职业规划。</strong> 人生不是这样,不是拿到一个好offer就能吃一辈子,<strong>不期而遇的突发事件才是生活的精彩之处</strong>。拿到了offer,生活还得继续,自己还得努力。


生活不是按照你的期望走下去,未来发生的事情不可控,之前自己的善良让自己吃了亏,没有其他offer,没有一个谈判的资本,让自己陷入尴尬的境地。现在明白了,在这个弱肉强食的社会,自己能做的,就是速度快一点,果断反应。


谋事在人,成事在天。感谢生命中那些精彩,让我知足也看的开。自己已经为部门这件事做了努力,剩下的就是靠时间来说明自己的选择是否正确。选择了一个新兴团队,希望能和团队在互联网行业突破重围,克服困难,而不是心神不宁,一直在担心未来会怎样。不走在路上,一直在观望徘徊哪知道这条路是对是错呢?

good luck

<strong>end from{{ site.url }}</strong>

================================================
FILE: _posts/2014-10-14-links-share-2014-10-14.md
================================================
---
layout: post
title: 前端资源分享
description: "分享一些前端、知乎、行业文章、有些工具资源等"
tags: [前端资源分享]
image:
  background: witewall_3.png
comments: true
share: true
---

>跬步积千里,滴水汇长河,整理的一些优秀链接,希望对大家有所帮助

## 2014年9月 精彩博客集合

<a href="https://github.com/hacke2/hacke2.github.io/issues/2" target="_blank">
	https://github.com/hacke2/hacke2.github.io/issues/2
</a>

## 2014年9月 前端资源分享

<a href="https://github.com/hacke2/hacke2.github.io/issues/1" target="_blank">
https://github.com/hacke2/hacke2.github.io/issues/1
</a>

## 2014年10月 上 前端资源分享

<a href="https://github.com/hacke2/hacke2.github.io/issues/3" target="_blank">
https://github.com/hacke2/hacke2.github.io/issues/3
</a>

<strong>end from <a href="{{ site.url }}"> {{ site.url }}</a></strong>

================================================
FILE: _posts/2014-10-2-great-nodejs.md
================================================
---
layout: post
title: 了不起的Node.js读书笔记
description: "一般结构和思路特别清晰的Node.js入门书籍"
tags: [读书笔记, Node.js]
image:
  background: witewall_3.png
comments: true
share: true
---

<figure>
	<a href="http://img11.360buyimg.com/n0/g15/M07/17/03/rBEhWVKMZ1AIAAAAAAVG8mJwrncAAFuKwEuVBwABUcK039.jpg">
		<img src="http://img11.360buyimg.com/n0/g15/M07/17/03/rBEhWVKMZ1AIAAAAAAVG8mJwrncAAFuKwEuVBwABUcK039.jpg" alt="home" />
	</a>
	<figcaption>了不起的Node.js</figcaption>
</figure>

<!--more-->

# 第二章 Js概览

## 基于GoogleV8引擎

 * Object.keys(o)
 * 数组方法:遍历forEach、过滤filter、改变map
 * 实现了String.prototype.trim()
 * 含有JSON解析

# 第三章 阻塞与非阻塞IO

## 单线程注意点

 * 小心处理内存中的变量,可能会影响两次访问的结果
 * 不要编写阻塞式代码,可能会影响第二次访问的时间

## 事件轮训

 *  先注册事件
 * 不断询问这些事件是否已经分发dispatch
 * 当事件分发了,相应的回调就会被触发
 * 如果事件未触发,则继续执行其他代码
 * 捕获未来才会执行到的函数所抛出的异常是不可能的
 * 避免同步IO

# 第四章 Nodez中的Javascript

## global对象

* 对应于浏览器window

## process对象

* process.nextTick == serTimeout(fn,1)

## 模块

 * require module exports
 * NPM
 * 绝对模块指Node内置模块以及在node_modules模块require(‘fs’)
 * 相对模块指通过相对路径找的模块require(‘./module’)
 * 暴漏数据exports.a(多个)、重写module.exports(一个)

##事件

 * EventEmitter
 * 事件监听 on,事件分发emit,事件移除removeListener
 * 只执行一次once
 * data事件 数据是部分到达,而不是一次性全到达返回给你

## buffer 

 * 处理二进制数据

# 第五章CLI &FS API

## Stream

 * stdin 可读流 stdout/stderr可写流
 * stdin.resume 等待用户输入
 * console == process.stdout.write(str + ‘\n’)

## fs

 * readdirSync(__dirname) readFileSync同步 
 * readdir(‘.’, async) readFile 异步 
 * createReadSteam 读取可变大小 有data、end事件多用于图片、大型文件等
 * watchFile监视文件是否改变

## process

 * process.argv 运行的参数
 * process.cwd 获取当前工作目录
 * process.env 环境变量
 * process.exit退出
 * 信号量

# 第六章TCP

## TCP

 * 面向连接,基于IP协议
 * IP协议发包无序,TCP给发送的IP包含了标示符和数据流顺序信息
 * 面向字节 对字符以及字符编码完全无知,很好的灵活性
 * 可靠性 三次握手、窗口时间重发
 * 流控制,对接收和发送的速度控制
 * 拥堵控制 避免拥堵、数包报的延迟率和丢包率不会太高

## Telnet

 * 当不是telnet协议是自动降级为TCP
 * 发送GET /HTTP/1.1模拟浏览器请求,两次回车

## net  

 * Node.js核心TCP模块
 * data close end事件
 * conn.setEncoding(‘utf-8’) 或 Buffer.toString(‘utf-8’)
 * 服务端createServer 客户端connect方法 connect事件

# 第七章HTTP

## HTTP

 * TCP上层协议
 * Content-Type类型 文本、HTML、XML、JSON、PNG
 * Transfer-Encoding: chunked 输出的内容长度不能确定,Node天生的异步机制,	这样相应可以逐形成
 * 301 永久转移 302 临时转移 304资源未改变 403未授权 404资源未找到 
 * 表单Content-Type application/x-www-form-unencoded

## http 模块

 * request、response 参数
 * 判断路由为method+url
 * querystring模块 将字符串解析成对象
 * request方法模拟一个请求,传回来的数据2进制,设置utf-8
 * superagent 模拟客户端(模拟一个请求)模块
 * up 重启服务器模块

# 第八章Connect

## 工具集&中间件

 * 模块:connect
 * 中间件调用server.user(...)
 * 日志中间件console.log(‘%s %s ’, req.method, req.url)
 * 模拟请求时间过长中间件,在res.end是清除定时器
 * static中间件 处理静态文件connect.static(‘..’)
 * query中间件 获取查询字符串connect.query
 * logger 中间件connect.logger(‘dev’)
 * body parser中间件connect.bodyParser()如果在POST使用了JSON格式,body 	parser自动转JSON对象,还可以处理用户上传文件req.body.file多文件表单name	使用name=”file[]”
 * seesion中间件 会话connect.session 使用方法req.session.user
 * redis session 会话持久化中间件
 * methodOverride 中间件 让低版本浏览器支持PUT、DELETE、PATCH
 * basicAuth中间件 用户身份验证

# 第九章EXPRESS

## express

 * WEB应用开发框架,基于Connect
 * app.set(‘view engine’, ‘ejs’) 设置EJS模板引擎
 * app.set(‘view’, __dirname + ‘/view’) 设置视图层路径
 * app.set(‘view cache’, ‘true) 设置模板缓存
 * 使用app.get()、app.put()、app.post()配置路由,可传参数如:id,获取req.params.id
 * res.render(‘search’,obj) 渲染模板
 * 其他设置大小写敏感、严格路由、jsonp回调
 * 为res和req提供了快捷方法 render渲染、redirect重定向req.header检查头信息
 * 中间件 app.user(function(req, res, next){})
 * 代码组织 分层、分包、MVC,建议仿照Spring MVC

## 模板引擎

Express/Haml/Jade/CoffeeKup/JQuery Templates for node

#第十章WebSocket

## Ajax

 * 异步javascripy
 * 缺陷;每次都建立HTTP请求,消耗网络资源,不适于实时服务
HTML5 WebSocket
 * 基于ws协议
 * node支持:websocket.io
 * 客户端new WebSocket

## 缺陷

 * 关闭不意味着断开,使用心跳检测机制判断
 * 对JSON支持不够友好
 * 客户端临时断开无法解决 使用定时器或者刷新页面?
 * 兼容性

# 第十一章Socket.io

## 优势

 * 跨浏览器,支持WebSocket则原生,不支持使用长连接方式,连接会持续打开	20-50s
 * 即使浏览器支持的WebSocket被代理或者防火墙禁止了,Socket.io仍然会通过其	他技术来解决
 * 如果客户端停止传输信息,并且一定时间没有正常的关闭,则认为连接已经断开
 * 当连接丢失时,自动重连
 * 对逻辑进行分层,有命名空间
 * 支持emit分发和listen监听事件

# 第十二章MongoDB

## MongoDB

 * 面向文档,绝大多数情况是JSON
 * 连接 new mongodb.Server(‘127.0.0.1’, 27017)
 * API open insert find ensureIndex findOne 
 * $set 设置 $push 推入数组

## Mongoose

 * 类似于JAVA中ORM框架,简化数据库开发
 * 连接mongoose.connect(‘mongodb://localhost/database’)
 * Schema:一种以文件形式存储的数据库模型骨架,不具备数据库的操作能力
 * Model: 由Schema发布生成的模型,具有抽象属性和行为的数据库操作对
 * Entity:由Model创建的实体,他的操作也会影响数据库
 * index 索引 title : {type : String, index : true} unique : true 唯一
 * new Schema({}).pre(‘save’, function(){})保存之前做一些处理
 * 常用API find,findOne,remove,update,count
 * new Schema({}).find({_id:‘xx’}).where(‘title’,‘xxx’).sort(‘content’, -1).limit(5).run(function(err, data){}) 类似JQ查询
 * .select(‘_id’, ‘name’)选择查询指定字段
 * .skip 跳过 mongoose.Schema.ObjectId 生成随机ID
 * clazz : [Clazz] 嵌套的Sehema
 * clazz: {type : ObjectId , ref: ‘Clazz’} 关联查询
 * 添加静态PersonSchema.statics.findByName通过model调用
 * 添加实例方法 PersonSchema.methods.findSimilarTypes Entity调用

# 第十三章MySQL

## MySQL 

 * 主要使用query执行SQL
 * 有占位符 ? 插入数据(和JAVA一样)
 * 使用seqelize Node版ORM框架

# 第十四章Redis

## Redis

 * 应用场景:简单数据模型、数据集。适合存储在内存
 * seesion持久化

# 第十五章 代码共享

## 书写兼容性代码

 * 导出模块 ,前端后端都可使用

(function(module){
module.exports = function(a, b ){ 
return a+b;
}
If(‘undefined’ != typeof window) {
Window.add = module.exports;
}
})(‘undefined’ == typeof module ? {module : {exports : {}}}: module) 

 * 模拟实现ECMA:扩展原型或者实现工具函数
 * EventEmitter。Assert、XMLHttpRequest、DOM、WebSocket、node-canvas都在	git上有实现
 * bowserbuild 将node模块转为浏览器可识别的代码

# 第十六章测试

## assert

 * 常用API ok,be/equal/eql/a/macth...

## Mocha

 * 简化书写
 * 测试异步代码
 * 生成报告

<strong>end from <a href="{{ site.url }}"> {{ site.url }}</a></strong>

================================================
FILE: _posts/2014-10-20-tink-in-Ghostjs.md
================================================
---
layout: post
title: GhostJs源码目录
description: "GhostJs源码的学习"
tags: [JavaScript]
image:
  background: witewall_3.png
comments: true
share: true
---

之前[Demon](http://Demon.com)写了一个JS类库[Ghosejs](https://github.com/DemonCloud/GhostJS),最近我打算学一下。

先贴一下整理的整体结构,前面的为行数。

```js
/**
名称 Ghostjs
版本 0.0.3

21 入口
38 G()函数入口,DOM加载后执行,兼容FF和IE,类似于$(function(){});如果是结点会走_G()
	116 引用了一些常见的方法
	146 常见的正则
	186 全局缓存
	204 UA判断
220 _G() 选择器包装入口,有length等,具体选择器在selector数组里
	276 queueSelector复杂选择器 G('div>p +warp'),最终找到P
	353 选择器入口 支持ID CLASS TAG * >选择
	378 _G原型方法
		381 each 对遍历元素的迭代,参数返回为dom, index, this(当前遍历对象) 
		441 signet 给_G元素加属性
		455 at 类似于JQ的eq
		477 back G(elm).at(n).xxx(做一堆事情).back().yyy(在原来的选择器上做事情)
		510 first last
		525 fix 调用AryFilter
		541 even odd
		563 next prev siblings
		667 warp 所选元素的子元素 warpClass warpTag ctains 
		724 obstruct 阻塞执行
		741 trash 清楚缓存
		765 事件 bind unbind once
		811 CSS方法 hide show adClass rmClass tgClass stStyle gtStyle
		909 属性方法stAttr rmAttr gtAttr
		948 动画 animate fdIn fdOut
		1027 DOM操作 insetHTML gtInHTML insetText gtInText rmNode apend
		1108 位置与大小 w h gtPos scTo bscTop bscBtom
1167 G的共用方法 实现了一些本类库的内部方法,兼容了部分ECMAScript 5、ECMAScript 6方法
1732 编码的一些转换	
1801 模板引擎
1875 一些判断 返回bool类型那种	
1921 ajax
1968 jsonp
2036 cookie
2141 事件
2256 其他内部方法
2411 Tween动画算法
**/
```

<!--more-->

大致的结构如此,今天和作者聊了一下午,他打算吧动画那一块还要做一些事情,加入点高级动画的特效

里面有很多技巧,比如项目入口就是兼容非CMD模块加载的解决方案,作者说还没加上去


还有各种部分ECMAScript 5、ECMAScript 6兼容方法

```js
G.AryFilter = function(ary, func) {
    if (nativeFilter) {
        //ECMAScript 5 filter
        // func(e) 返回为 true. 则会被保留. 如果 func(e) 返回为false. 那就会被过滤从数组中移除掉
        G.AryFilter = function(ary, func) {
            return ary.filter(func)
        };
    } else {
        G.AryFilter = function(ary, func) {
            //ary [1,2,3,4,5]
            //func function(e){ return e!==4 } -> [1,2,3,5]
            for(var i = ary.length;i--;){
                if (!func(ary[i],i))  splice.call(ary,i,1);
            }
            return ary;
        };
    }
    return G.AryFilter(ary, func)
};
```

还有一些函数的处理技巧,如下时间绑定,在第一次判断兼容性,将函数覆盖,之后就不用判断了

```js
 function OneBind(e, event, callback) {
    if (doc.addEventListener) {
        OneBind = function(el, eve, call) {
            el.addEventListener(eve, function() {
                el.removeEventListener(eve, arguments.callee);
                call.call(el);
            });
        };
    } else {
        OneBind = function(el, eve, call) {
            el.attachEvent("on" + eve, function() {
                call.call(el);
                el.detachEvent("on" + eve, arguments.callee);
            });
        };
    }
    return OneBind(e, event, callback);
}
```


DEMON一个乐于分享自己的一些经验的同学,知识只从外国网站获取,是一位很有潜力的牛人,以后混的好可别忘了我啊:D

**end from [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2014-10-22-html5-javascript-web-dep.md
================================================
---
layout: post
title: HTML5和JavaScript Web应用开发读书笔记
description: "《HTML5和JavaScript Web应用开发》主要介绍如何使用HTML5、JavaScript和最新的W3C规范构建可用于所有浏览器和设备的Web应用"
tags: [读书笔记]
image:
  background: witewall_3.png
comments: true
share: true
---

<figure>
	<a href="http://img11.360buyimg.com/n0/g14/M07/17/04/rBEhV1JnaDgIAAAAAAIMoOWOE-gAAEhdAArwQ4AAgy4171.jpg">
		<img src="http://img11.360buyimg.com/n0/g14/M07/17/04/rBEhV1JnaDgIAAAAAAIMoOWOE-gAAEhdAArwQ4AAgy4171.jpg" alt="home" />
	</a>
	<figcaption>HTML5和JavaScript Web应用开发</figcaption>
</figure>

<!--more-->

# 第一章 客户端架构

 * 过去前端开发人员不用关心用户界面后的框架,从未先现在一样关注浏览器的性能
 * 过去利用服务端模板和组件框架,如JAVA 的JSP,Velocity,前端只是套个模板而已
 * 如今浏览器的性能已经得到了很大的提升,很多逻辑在客户端写,而后台仅仅提供Restful风格的接口
 * 我们现在创建的不是网站,而是基于HTML5,CSS3和JavaScript的**可靠地应用程序**
 * 服务端模板引擎已经逐渐被JavaScript模板所取代
 * JavaScript API得到了更多硬件访问的支持,例如Geolocation、Web Workers
 * 应该为当前的项目作出价值的决策,必须建立和维护编写、测试、和调试代码与选择框架的工作流
 * [WEB开发模式已经逐渐在演化](https://github.com/lifesinger/lifesinger.github.com/issues/184),我们前端是新时代的先锋,抓住这个机会,创建性能强大,可伸缩的应用,利用WEB最新规范将其推进一步,变得更好。

# 第二章 移动WEB

 * 28%会使用移动设备来冲浪,但也有很大一部分人使用IE9以下的浏览器
 * 维基百科 [HTML5引擎对比页面](http://en.wikipedia.org/wiki/Comparison-of-layout_engines_(HTML5))
 * Webkit、Mobile Firefox、OperaMobile
 * [浏览器的市场份额](http://www.netmarketshare.com/browser-market-share.aspx?qprid=0&qpcustomd=1),[最新浏览器HTML5支持](http://caniuse.com)
 * 优雅降级
 * [移动设备模拟器列表](http://www.mobilexweb.com/emulators)

# 第三章 为移动WEB构造程序

 * 移动设备的成功依赖于两个因素:所以平台一致的外观;具有离线能力、UI动画和通过Rest风格或者WebSocket端点读取和发送数据的后端服务
 * 有两个影响:CPU/GPU的速度和互联网速度
 * [移动端的设计模式](http://mobiledesignpatterngallery.com/mobile-patterns.php)
 * 要考虑的事情:硬件加速,内存分配和计算负担,电池的消耗与寿命,使用canvas代替image
 * [常见交互](http://html5e.org/example) 滑动,翻转,旋转transtion,transtform,transtlate.建议使用translate3d, 2d转换不支持GPU加速
 * 使用Chrome查看每秒帧数FPS,查看是否加速用合成渲染边框
 * [读取和缓冲,将AJAX缓冲到localStorage](https://github.com/html5e/slidfast/blob/master/slidfast.js#264) 可存5M
 * IOS使用InnerHTML可能会出问题
 * [网络类型检测与处理](https://github.com/html5e/slidfast/blob/master/slidfast.js#L536)
 * 移动WEB常用于单页,可以平滑的向原生应用过渡,减少了请求次数

## 移动框架
 
 * 对触摸屏设备的优化,确保使用CSS3过渡处理动画
 * 在所有主流平台浏览器上跨平台一致性
 * 使用或封装最新的HTML5 CSS3标准
 * 框架背后的强大开源社区
 * 单页框架:[JQuery Mobile](http://jquerymobile.com), [JQTouch](http://jqtouch.com)
 * 无页面结构框架:[xui](http://xuijs.com)
 * 100%JavaScript驱动:[SenchaTouch](http://www.sencha.com/products/touch), [Wink Tooolkit](http://www.sencha.com/products/touch), [The-M-Project](http://the-m-project.net)

## 移动调试

 * [weinre](http://people.apache.org/~pmuellr/weinre)
 * [Adobe Shadow](http://labs.adobe.com/technologies/shadow)
 * [Opera远程调试](http://www.opera.com/dragonfly/documentation/remote)

# 第四章 桌面WEB

 * 由于AJAX的出现,在后台生成HTML的时代宣告结束
 * 在客户端生成HTML降低了服务器的负载
 * [使用HTML5 + Node.js的例子,比前身快2~10倍](http://venturebeat.com/2011/08/16/linkedin-node)

### 客户端优势

 * 更好的用户体验
 * 网络带宽减少(降低成本)
 * 具有可移植性(离线)

### 服务端优势

 * 更好的安全性
 * 减少客户端的处理开销(移动端电池)
 * 具有可扩展性(方便添加更多服务器)
 * 性能检测可以使用UA或[Modernizr.js](http://modernizr.com)

## 特征检测

 * 原生特征检测一般使用创建一个元素看某一个方法是否存在
 * 使用[Modernizr.js](http://modernizr.com)可能会带来加载时间超过30MS,因为必须在DOM加载之前渲染各个值,
 * 使用[Modernizr.js](http://modernizr.com)不建议在生产环境中使用,但是可以在开发阶段使用它将各个浏览器的兼容性先调试好
 * [FormFactory.js](https://github.com/PaulKinlan/formfactor)可以检测不同类型的的设备,如移动设备版本、电视版本

## UA

 * window.navigator.userAgent检测,但是不可靠
 * Google的一款UA解析器,基于JSON[ua-parser](https://github.com/tobie/ua-parser),另一款基于JS[platform.js](https://github.com/bestiejs/platform.js)
 * 服务端检测,[MobileESP](http://blog.mobileesp.com)用来检测userAgent的首标

## 压缩

 * 确保之压缩可压缩的内容,不要把资源浪费在可压可不压的内容上
 * 未访问这选择正确的压缩方案
 * 正确配置WEB服务器,将压缩的内容发给具体的有解压能力的客户端
 * 如果一个大型页面(20k ~ 30K)压缩可能会加载CPU的负载,远大于SQL的执行,建议不压身
 * 压缩的目标可以有HTML, CSS, JS, XML, JSON, HTC, TXT(Robots.txt)
 * 可使用GZIP(减少70%,90%浏览器支持)或DEFLATE
 * 压缩JS和CSS的工具有Closure Cpmpiler, Yahoo!YUI Compressor, JSMin, Packer,
 * 前端构建(验证压缩合并等)[grunt](https://github.com/gruntjs/grunt), [Jawr](http://jawr.java.net), [Ziproxy](http://ziproxy.sourceforge.net)

## JavaScript MVC框架

 * [常见MV*框架的演示程序 TodoMVC](https://github.com/tastejs/todomvc)
 * [Backbone](https://github.com/jashkenas/backbone) [书中的例子](https://github.com/html5e/backbone-jax-cellar)
 * [Ember](https://github.com/emberjs/ember.js) [书中的例子](https://github.com/html5e/ember_data_example)
 * [Angular](https://github.com/angular/angular.js) [AngularJS译本](https://github.com/peiransun/angularjs-cn) [书中的例子](https://github.com/html5e/angular-phonecat-mongodb-rest)
 * [Batman](https://github.com/batmanjs/batman) [书中的例子](https://github.com/html5e/batmanjs-address-book)
 * [Knockout](https://github.com/knockout/knockout) [书中的例子](https://github.com/html5e/knockout-rest)

# 第五章 WebSocket

 * 从浏览器发出请求包含了header,无压缩的header可能有200b~2kb之前
 * WebSocket通过套接字的全双工同学,是客户端和服务器通信的高效手段
 * 优雅降级是指在WebSocket不受支持时退回到就技术(Flash或长轮训)
 * NIO和线程直接的争论永无止境,一般的,高并发建议NIO,对计算有很大要求的用多线程
 * 观察者模式,一般的有三个事件,OPEN, MESSSAGE, CLOSE
 * [使用Jetty服务器实现WebSocket的例子](https://github.com/html5e/HTML5-Mobile-WebSocket)
 * 不仅可以传递文本,JSON,而且可以传递二进制,用老发送流式音频,也可以提供画布(你画我猜)与实时的屏幕共享技术
 * 使用代理技术如HAProxy让拆除服务器又不影响新的服务

### 优势

 * 没有HTTP Header
 * 没有持续(Keep-alive)问题引起的时滞
 * 低延时,更好地吞吐量和相应能力
 * 对移动设备的电池有利

## 框架

 * [Ver.x](https://github.com/vert-x/vert.x)是一个全异步,通用的JVM语言应用容器,是JVM版的Node.js
 * [Socket.io](http://socket.io)目标是在每种浏览器和移动设备实现应用,优雅降级
 * [Atmosphere](https://github.com/Atmosphere)可运行在任何基于JAVA的WEB框架
 
# 第六章 Web Storage

 * Cookie只有4K的存储量,而且每次都会带在HTTP请求头,与服务器共享
 * Web Storage有5M,但是存储数据若为UTF-16只有2.6M,IE和Firefox除外
 * Web Storage分为localStorage和sessionStorage(关闭浏览器或标签会消失)
 * 读取或存储数据,是阻塞式的
 * 常用API:length;key(n);getItem(key);setItem(key, value);removeItem(key);clear();
 * [使用localStorage[name] = 'hacke2',localStorage.name = 'hacke2', localStorage.setItem('name', 'hacke2')效率不同](http://jsperf.com/localstorage-key-vs-localstorage-key-vs-localstorage-ge)
 * 同步问题使用StorageEventAPI解决
 * 使用JSON在Web Storage上要进行编码和解码
 * 无安全性可言
 * 浏览器隐私模式下存储会出现异常
 * 使用场景,存储一些Base64的图片,用户搜索的一些数据(神马搜索)等,QQ空间、Disqus评论将草稿存储在loaclStorage,自动登录,[带有时间戳的缓存](https://github.com/pamelafox/lscache)等
 * [从客户端缓冲数据 允许离线且连接到网络时刷新数据](http://engineering.linkedin.com/mobile/linkedin-ipad-using-local-storage-snappy-mobile-apps)
 * [用Backbone进行数据库同步](http://blog.oxfordcc.co.uk/backbone-local-storage-and-server-synchronization)
 * [在任何浏览器中使用Web Storage](https://github.com/wojodesign/local-storage-js)

## 框架

 * [LawnChair](https://github.com/brianleroux/lawnchair)轻量级支持移动设备
 * [persistence.js](https://github.com/coresmart/persistencejs)用于服务端,集成Node.js和MySQL

# 第七章 Geolocation

 * 提供对于宿主设备相关的地理位置信息的脚本访问,定位用户移动时跟踪器经纬度
 * 地理防护:进入或离开一个位置进行提醒
 * 地址匹配:利用Google将经纬度转为实际地址
 * 一般跟踪:跟踪汽车,走路,跑步的距离
 * navigator.geolocation.getCurrentPosition(function(){})
 * [防止激活Geolocation的一个变通方法](http://html5e.org/example/geo)
 * 实例:用户跟踪,反向地址匹配
 * [Geolocation API跨浏览器支持](http://bit.ly/Geolocation-API-Polyfill)

## 框架

 * [geo-loaction-javascript](code.google.com/p/geo-location-javascript)
 * [Webshims lib](https://github.com/aFarkas/webshim)

# 第八章 Device Orientation API

 * 加速度计,陀螺仪,指南针
 * [实例:用设备的移动完成滚动](http://www.html5e.org/example/orientation)

# 第九章 Web Workers

 * 当WEB应用需要在JavaScript进行繁重的工作和后台处理的时候,推荐使用
 * [Web Worker API检测](http://html5-shims.googlecode.com/svn/trunk/demo/workers.html)
 * [Web Worker 性能测试](http://html5-demos.appspot.com/staic/workers/transferables/index.html)
 * [实例:池化和并行作业](http://html5e.org/example/workers) [对应的演示程序](https://github.com/html5e/slidfast/blob/master/example/workers/index.html)
 * [实例:处理图像](http://www.smartjava.org/examples/webworkers2)

**end from [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2014-10-29-2014-10-d2.md
================================================
---
layout: post
title: 2014.10.25 杭州D2行
description: "2014.10.25 杭州D2行"
tags: [游记]
image:
  background: witewall_3.png
comments: true
share: true
---

<figure>
	<a href="https://github.com/soulteary/Get-D2-2014-Ticket/raw/master/assets/img/figure.png">
		<img src="https://github.com/soulteary/Get-D2-2014-Ticket/raw/master/assets/img/figure.png" alt="home" />
	</a>
	<figcaption>D2前端技术论坛</figcaption>
</figure>

>参加交流会坐在台下看台上大牛的分享,有种时光交错的感觉。在一个最好的时代与时间最精英的人,挤挤一堂,梦想成为这个时代最有创造力的一代,而不是垮掉的一代。----豪情 
	
这次D2和[@liningone](https://github.com/liningone)一起去的,25个小时的火车(没钱啊TT),一路奔波,终于来到了杭州,短暂休息了一下,就跑去阿里西溪总部先观望了一下,结果门卫大哥不让我们进去,只好在门口照了几张相
<figure>
	<a href="/images/2014-10-d2-albb.jpg">
		<img src="/images/2014-10-d2-albb.jpg" alt="home" />
	</a>
	<figcaption>阿里巴巴西溪园区门口</figcaption>
</figure>

<!--more-->

回去收拾了一下就睡了,整整一天的火车还是挺累的。
第二天一早,就打的又过去,这次有阿里的同学负责接应,最后到了会场,扫描了二维码,然后碰见以为百度地图的小伙在那边聊天,期间碰见了[@小胡子哥](https://github.com/barretlee),打了个招呼,也合了个影:)。

<figure>
	<a href="/images/2014-10-d2-xiaohuzi.jpg">
		<img src="/images/2014-10-d2-xiaohuzi.jpg" alt="home" />
	</a>
	<figcaption>和小胡子哥</figcaption>
</figure>

后来还看见[@张鑫旭](http://www.zhangxinxu.com/wordpress/),旁边围的人挺多的,如众星捧月一般,没好意思过去,只是远远的观望了一下,很黑很高很瘦,不知道的还以为田径运动员。没多久,就和[@liningone](https://github.com/liningone)一起进入到会场。
<figure>
	<a href="/images/2014-10-d2-dahui.jpg">
		<img src="/images/2014-10-d2-dahui.jpg" alt="home" />
	</a>
	<figcaption>D2大会开始前</figcaption>
</figure>

很兴奋,主持人[@aoao](http://weibo.com/aoaoing?topnav=1&wvr=6&topsug=1)一口标准的普通话让人捧腹大笑,期间和旁边的一位杭州就职的聊了几句,我称呼您,他说他不适应。。会议开始了,首先将D2的创始人圆心简单的介绍了一下D2的创建以及历史,和对中国前端的一些展望,然后正式开始,因为很想听听[《支付宝前后端分离的思考与实践》](http://vdisk.weibo.com/s/C30SUspJtfe1v),所以果断去了分会场,没想到一进去,这么多人。。没地方做,站着听了一会。苏千引入了一个“大前端”的概念,主要讲了为什么进行前后端的分离,谈了谈更清晰的职责划分的优势,并引出了阿里chair框架,对模板引擎,单元测试,自动化UI测试,性能提升,日志报警等都有很好的解决方案。听完后就去吃饭,排了很长的队伍,但是阿里的饭菜还是很给力的
<figure>
	<a href="/images/2014-10-d2-shitang.jpg">
		<img src="/images/2014-10-d2-shitang.jpg" alt="home" />
	</a>
	<figcaption>阿里食堂的伙食</figcaption>
</figure>
吃完饭和[@liningone](https://github.com/liningone)去器自行车逛了一圈阿里西溪园区,后来接到[豪哥](https://github.com/jikeytang)电话,终于看见心中的男神了,聊了一会儿,大家过去D2门口照了张相
<figure>
	<a href="/images/2014-10-d2-haoqing.jpg">
		<img src="/images/2014-10-d2-haoqing.jpg" alt="home" />
	</a>
	<figcaption>从左往右:豪情,ngot, 桃子, undefined, 我</figcaption>
</figure>

和群友一起进入主会场,听接下来的三场:[nodejs一小步 前端开发一大步](http://vdisk.weibo.com/s/C30SUspJtfe4O),[第三方开发前端实践](http://vdisk.weibo.com/s/C30SUspJtfdhI),[面向多端的蘑菇街前端技术架构](http://vdisk.weibo.com/s/C30SUspJtfdi5),[京东前端工业化实践之路](http://vdisk.weibo.com/s/C30SUspJtf4sv),由于下午精神不是很好,听的不是很仔细,去和豪哥上厕所是碰见大神[winter](http://weibo.com/wintercn?from=feed&loc=nickname),赶紧去握了一下手:D(其实是去外面休息一下碰见了)

总结一下,下午主要听了有两个概念:Node.js和前端工业化。由于Node.js的出现,让我们前端成为全栈成为可能,我们可以发挥自己想象力为项目或者产品做更多的事情,同时,前端也有了更多的职责,更大的压力,地位也是显著的提高。对于前端工业化,我之前有一个文章没写完[高大上Web前端开发环境](http://www.hacke2.cn/web-development-process/),其实就是各个公司讲了一下他们公司对于前端工业化的思路与实现,下来再看看分享的PPT。


第二天和liningone去西湖玩,租了自行车沿着西湖转了一圈,整整一天!沿途的风光很美,特别是在雷峰塔上的广阔视野和断桥残雪上的夕阳。下次来的话一定得去一下钱塘江感受一下!
<figure>
	<a href="/images/2014-10-d2-leifeng.jpg">
		<img src="/images/2014-10-d2-leifeng.jpg" alt="home" />
	</a>
	<figcaption>雷峰塔</figcaption>
</figure>

<figure>
	<a href="/images/2014-10-d2-duanqiao.jpg">
		<img src="/images/2014-10-d2-duanqiao.jpg" alt="home" />
	</a>
	<figcaption>断桥残雪</figcaption>
</figure>

**end from [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2014-10-3-node-westom-mina.md
================================================
---
layout: post
title: 利用Node.js对某智能家居服务器重构
description: "利用Node.js天生NIO特性"
tags: [Mongoose]
image:
  background: witewall_3.png
comments: true
share: true
---

之前负责过一个智能家居项目的开发,外包重庆一家公司的,我们主要开发服务器监控和集群版管理。

移动端和机顶盒的远程通信是用中间服务器完成交互,服务器使用MINA NIO框架,非阻塞式的,可以看看以前博客了解下<a href="http://blog.csdn.net/hacke2/article/details/32188927">某智能家居项目框架学习总结</a>,或者其他资料<a href="http://weixiaolu.iteye.com/blog/1479656">JAVA NIO原理</a>,<a href="http://www.iteye.com/topic/166596">基于MINA框架快速开发网络应用程序</a>。

在移动端或者机顶盒登录后会使用spring security 进行加密,主要是结合用户名和密码来加密,生成一个唯一标示符。服务器来到一个请求时会检查对应的标示符来发送相关约定好的命令,如登录到移动端向服务器发送命名,服务器会生成如522f9e2a459de81d6a9e9eadfa9468d1的标示符,如果在机顶盒集合里也存在相应标示符的主控,则给他发送。

最近关注Node.js,这不就是Node的特性NIO吗?

让我们来着手重构一下,利用Node.js的先天优势,高并发,非阻塞式

<!--more-->

```js

var MyClient = function (client, username, password, type){
	this.client = client;
	this.username = username;
	this.password = password;
	this.type = type; //0是机顶盒,1是客户端
}

MyClient.prototype.write = function(msg) {
	this.client.write(msg + '\r\n');
}

module.exports = MyClient;

```

每一个连接都有它的用户名和密码,也有它的client,也就是Socket。也有一个标示符,表示是主控还是客户端

然后添加一个原型方法,用来向当前client发送信息

下面就是编写主程序了,使用Node.js进行网络应用程序的开发很简单,详细大家能看懂

```js
//tcp
var net = require('net');
var crypto = require('crypto');



var MyClient = require('./MyClient');

var server = net.createServer();

//客户端,如平台、移动端进来放在这个数组中
var clientArr = [];
//主控端,主要装的是机顶盒的连接
var boxArr = [];


server.on('connection', function(client){

	
	client.setEncoding('utf-8');
	client.write('plase input name|password|type :\n');

	var myClient; 
	var message = '';
	//发送消息
	client.on('data', function(data){
		//如果是非回车则累加
		if('\r\n' != data || data == '' || data == null) {
			message += data;
		}else {
			//说明是已经注册的client
			if(myClient) {
				sendMsg(message, myClient);
			}else{//说明是第一次进来
				var userInfo = message.split('|');
				var md5 = crypto.createHash('md5');
				//使用用户名和密码进行加密,放入password中
				md5.update(userInfo[0] + userInfo[1]);
				var password = md5.digest('hex');
				myClient = new MyClient(client, userInfo[0], password, +userInfo[2]);
				//如果是客户端
				if(myClient.type) {
					clientArr.push(myClient);
				}else {
					boxArr.push(myClient);
				}
				console.log('新加用户' + password);
			}
			message = '';
		}
		
		
		
	})
	//断开时移除这个客户端
	client.on('end', function(data){
		console.log('end....');
		//有还未登录就退出的情况
		if(myClient) {
			if(myClient.type) {
				clientArr.splice(clientArr.indexOf(myClient), 1)
			}else {
				boxArr.splice(boxArr.indexOf(myClient), 1)
			}
		}
		
	})
})

server.listen(3000);

function sendMsg(msg, myClient) {
	console.log(' sendMsg : ' + msg);
	var array = myClient.type == 1 ? boxArr : clientArr;
	for (var i = 0; i < array.length; i++) {
		if (myClient.password == array[i].password) {
			 array[i].write(msg);
			 console.log(myClient.name + myClient.type == 1 ? '移动端' : '主控' + '发送消息....');
		};
	};
}

console.log('listening....');
```

我们来测试一下,利用telnet,使用约定好的协议进行登录,cqut 123456 1,cqut 123456 0,cqut2 123456 1,(这里不是空格,而是I符号,在文章内显示有问题,具体看代码分割就明白了)可以看到,cqut只是给cqut的机顶盒发送,而cqut2的接受不到。

<figure>
	<a href="/images/article/16.jpg">
		<img src="/images/article/16.jpg" alt="home" />
	</a>
	<figcaption>只给对应的设备发,给其他设备不会发送</figcaption>
</figure>

当然Mina还有其强大的过滤器,利用Node.js的中间件就能很好的实现,请读者自行研究

<strong>end from <a href="{{ site.url }}"> {{ site.url }}</a></strong>

================================================
FILE: _posts/2014-10-31-es6-modules-today-with-6to5.md
================================================
---
layout: post
title: 译-使用6to5,让今天就来写ES6的模块化开发!
description: "ES6 modules today with 6to5"
tags: [翻译]
image:
  background: witewall_3.png
comments: true
share: true
---

>http://es6rocks.com/2014/10/es6-modules-today-with-6to5/?utm_source=javascriptweekly&utm_medium=email 原文链接

我之前在Twitter上发过一个照片,表达出我有多快乐,这像是一个时光机让我们可以穿梭到未来-ES6的时代!下面让我来展示如何使用6to5让今天就可以练手ES6的模块化。

<figure>
	<a href="http://es6rocks.com/img/modules-today-6to5.png">
		<img src="http://es6rocks.com/img/modules-today-6to5.png" alt="home" />
	</a>
	<figcaption>使用6to5让今天就可以练手ES6的模块化</figcaption>
</figure>

<!--more-->

# 第一步

如果你现在还不了解ES6的模块化开发,请在[JSModules.io](http://JSModules.io)上了解一下。我也推荐大家读一下@jcemer的文章[A new syntax for modules in ES6](http://es6rocks.com/2014/07/a-new-syntax-for-modules-in-es6/),它涉及到了很多非常酷的关于JS模块化的东西。他可以指导我们使用6to5。总的来说,6to5能在支持ES5d的环境下提前尝试ES6 模块化开发的快感。
6to5比其他降级工具有一下几个优势:
 * 可读性:你的格式化的代码尽可能的保留。
 * 可扩展性:有非常庞大的插件库和浏览器的支持。
 * 可调式性:因为支持source map,你可以方便的调试已经编译过后的代码
 * 高效率:直接转化为与ES相当的代码,不会增加额外的运行十几

# 一起来写模块

让我们来尝试着写模块吧!
我们的应用除了输出日志不会做其他事情,其主要的目的就是让你了解模块化如何工作和如何让你现有的环境使用ES6的模块化开发。
基本的目录结构:

	├── Gruntfile.js
	├── package.json
	└── src
	    ├── app.js
	    ├── modules
	    │   ├── bar.js
	    │   ├── baz.js
	    │   └── foo.js
	    └── sample
	        └── index.html

app.js是主程序,包含了我们将要存储的模块化的目录
下面是app.js的代码:

```js
import foo from "./modules/foo";
import bar from "./modules/bar";

console.log('From module foo >>> ', foo);
console.log('From module bar >>> ', bar);
```

以上代码非常简单,我们导入了foo模块和bar模块,然后分别打印出他们

```js
// foo.js
let foo = 'foo';

export default foo;


// bar.js
let bar = 'bar';

export default bar;
```

在这些模块一面我们只是导出了两个字符串'foo'和'bar',当我们导入这些模块,我们的变量其实已经有数据。
当然,我们何以导出对象,类,函数,等等
现在,你可以开始模仿这个例子写出你自己的模块

# 构建

就像你已经知道的,[ES6不支持你现在的浏览器和Node](http://kangax.github.io/compat-table/es6/).js,只有一条路,那就是使用降级转换器来编写ES6的模块化代码。
正如我之前提到的那个,我使用6to5,他可以精确的达到我们想要的效果。
这个任务是运行在Grunt上的,我们使用 @sindresorhus的 [grunt-6to5](https://github.com/sindresorhus/grunt-6to5)

```js
npm install grunt-cli -g
npm install grunt --save-dev
npm install grunt-6to5 --save-dev
```

我们的Gruntfile类似于一下:

```js
grunt.initConfig({
    '6to5': {
        options: {
            modules: 'common'
        },

        build: {
            files: [{
                expand: true,
                cwd: 'src/',
                src: ['**/*.js'],
                dest: 'dist/',
            }],
        }
    }
});
```

To test it in the browser, I made a copy task that just copies the sample/index.html file to our dist directory.
The HTML file looks like this:

这是个简单又给力的配置,我们也几乎完成了。
当你指定好源文件和输出文件后,这个任务就可以来运行了。
'common'选项的目的在于告诉6to5我们将输出ES5CommonJS模块化风格。
当然,6to5也支持AMD,我写了sample/index.html,让他在浏览器环境下测试一下,这个HTML的代码如下:

```html
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ES6 modules 6to5</title>
</head>
<body>
    <script src="//[cdnjs URL]/require.min.js"></script>
    <script>
        require(['app.js']);
    </script>
</body>
</html>
```

观察上面的代码,我们使用AMD的RequireJS框架来加载这个JS,对于这个例子,你需要将上面的配置文件改为 modules: 'amd'

# 运行

万事俱备东风只欠,我们的代码已经放在[es6-modules-today-with-6to5](https://github.com/es6rocks/es6-modules-today-with-6to5),你可以克隆下来自己玩玩。使用npm install安装6to5

记住一点,Grunt任务会生成一个目标文件夹来存放转化后的代码
所以,如果你想测试使用CommonJS规范的转化后的ES6的代码,你可以执行一下命令

node dist/app.js

<figure>
	<a href="http://es6rocks.com/img/running-node.png">
		<img src="http://es6rocks.com/img/running-node.png" alt="home" />
	</a>
	<figcaption>Node.js上的运行效果</figcaption>
</figure>

如果你使用AMD规范的,请在浏览器访问index.html(**吐槽一下,老外竟然不知道中国的[sea.js](https://github.com/seajs/seajs)**)

<figure>
	<a href="http://es6rocks.com/img/amd-es6.png">
		<img src="http://es6rocks.com/img/amd-es6.png" alt="home" />
	</a>
	<figcaption>在浏览器执行的效果</figcaption>
</figure>

# 结论


通过这个简单的实例你学会了如果简单的使用ES6模块化风格来编写代码。6to5是胃肠棒的工具让你穿越到未来提前体验ES6模块化带来的快感。资源下载[es6-modules-today-with-6to5](https://github.com/es6rocks/es6-modules-today-with-6to5),欢迎提交一些问题的反馈


**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2014-11-10-javascript-aop.md
================================================
---
layout: post
title: 简单几行代码,实现JavaScript中的AOP
description: "JavaScript中的AOP的模拟与实现"
tags: [JavaScript]
image:
  background: witewall_3.png
comments: true
share: true
---

>AOP我们在后台常常听见,那么在前端是否也有这个概念呢?

## 现存的方式

我们写了一段计算比较密集的代码:

```js
function complexFunc() {
	sleep(1000)
}

function sleep(maxtime) {
	var now = +new Date();
	while(true) {
		if(+new Date() - now > maxtime) {
			break;
		}
	}
}
```

我们在这边定义一个复杂函数,用一个伪睡眠函数模拟。突然需求来了:

>产品经理:这个函数计算时间挺多的,我们想将这个函数在客户机器上真实的运行时间记录下来做一些统计,你把这个代码改改,加一个统计运行时间的功能发给后台。

>前端程序员:哦,好的。

现在我们向在这个`complexFunc`函数中做执行时间的记录。动手改一下上面的代码。

<!--more-->

```js
function complexFunc() {
	var now = +new Date();
	sleep(1000);
	//$.get('xxx/log.do?time' + +new Date() - now > maxtime + '&funcName' + arguments.callee.name)	发送给后台
	console.log(+new Date() - now, funcName);	//模拟运行
}

//运行结果:
1014
```

代码开开心心写完了,然后需求又来了。

>产品经理:其他几个函数也加一下吧

>前端程序员:嗯,行。

```js
function complexFunc() {
	var now = +new Date();
	sleep(1000);
	//$.get('xxx/log.do?time' + +new Date() - now > maxtime + '&funcName' + arguments.callee.name)	发送给后台
	console.log(+new Date() - now, funcName);	//模拟运行
}


function otherComplexFunc() {
	var now = +new Date();	//和上面完全重复,复制过来俗称COPY 改
	sleep(1500);
	//$.get('xxx/log.do?time' + +new Date() - now > maxtime + '&funcName' + arguments.callee.name)	完全重复
	console.log(+new Date() - now, funcName);	//模拟运行
}

//其它要加统计时间代码的函数
//....
```

后台也做了统计完成后:

>产品经理:嗯,这些函数现在没必要统计他的执行时间,你去把那些你家的代码给去掉。

>前端程序员:What the f2ck?

已经上线的项目不能轻易改动,更何况改动如此之大,找都得找半天苦逼的程序员如果出错就只能怪在你身上了T T


## 什么是AOP?

AOP这个概念是来源于后台开发,指面向切面编程。在我们的项目中一般仅限于声明式事务,不过后来在做豌豆荚社区时用到了AOP的异常捕获、会员积分记录、日志系统等。AOP的使用大大的降低了代码的耦合度。真真的实现了代码的可插拔。

可以使用现实中的例子:年轮。树的年轮用来记录树的年龄,每一年加一轮。我们可以把与业务无关的代码就像是年轮一样将之包裹,并没有侵害已有代码,如果不需要这个功能,就在调用的时候给去掉。**要知道,在调用处改比在函数实现内部改要好一万倍!**

传统AOP的实现原理为动态代理,我之前层深入分析过[对Spring.Net的AOP一些思考及应用](http://blog.csdn.net/hacke2/article/details/12753379),[动态代理及JDK动态代理源码分析](http://blog.csdn.net/hacke2/article/details/23712633)。每一个代理类不用重新定义,而是只要你符合那个规范会利用反射技术动态生成出那个代理对象。我们使用JavaScript语言的特殊性,轻轻松松就可以实现代码的可插拔。

## 函数的封装

我们知道,我们可以给JavaScript原生对象扩展其属性、方法。JavaScript对于`功能的封装`就是在函数里,我们在函数里面扩展一个before方法。

```js
//前置通知
Function.prototype.before = function(func) {
	var that = this;
		args = [].slice.call(arguments,1);
	return function() {
		//debugger
		if(func.apply(this, args) === false) {
			return false;
		}
		return that.apply(this, arguments);
	}
}

//后置通知
Function.prototype.after = function(func) {
	var that = this;
		args = [].slice.call(arguments,1);
	return function() {
		var ret = that.apply(this, arguments);
		if(ret === false) {
			return false;
		}
		func.apply(this, args);
		return ret;
	}
}

//环绕型
Function.prototype.around = function(beforeFunc, afterFunc) {
	var that = this;
	return function() {
		return that.before(beforeFunc).after(afterFunc).apply(this, args);
	}
}

//捕获异常
Function.prototype.throwing = function(throwingFunc) {
	var that = this;
		args = [].slice.call(arguments,1);
	return function() {
		try {
			return that.apply(this, arguments);
		} catch(e) {
			throwingFunc && throwingFunc.call(this, e, args);
		}
	}
}

```

这里先只提供四个API:

* 前置通知before:在函数调用之前调用的函数func
* 后置通知after:在函数调用之后调用的函数func
* 环绕通知around:传递前置、后置函数,将其包裹
* 抛出异常后通知throwing:异常的控制

只说说第一个函数,这里有一个闭包,引用了上一层传来`this`和`arugments`的返回一个加工后的函数。在这里我们并不是简简单单的只是将功能函数在业务函数之前执行,而是判断了一下功能函数的返回值,如果是`false`。则不执行已有函数,类似于一个`拦截器`或者`过滤器`的功能,在NOde.js叫中间件。

因为是直接扩展在`Function`上的,可以进行`链式操作`。如:

```js
func.before(func1).before(func2).after(func2)(arg1)
```

## 重构上面的代码

下面,我们来重构一下

```js
//将时间记录函数封装一下
function logTime (func) {
	return func = (function() {
		var d;
		return func.around(function() {
			d = +new Date();
		},function() {
			console.log(+new Date() - d, func.name);
		});
	})()
}

//像年轮一样将业务函数包裹,不会污染已有代码
logTime(complexFunc)();

logTime(otherComplexFunc)();

//运行结果:
1014
2024
```

<figure>
	<a href="/images/article/2014-11-10/1.jpg">
		<img src="/images/article/2014-11-10/1.jpg" alt="home" />
	</a>
	<figcaption>像年轮一样无限扩展。。这就是AOP!</figcaption>
</figure>

我们的代码就像被年轮函数被包裹,而且此函数可以再次被年轮函数包裹!如果需求改动,只需轻轻松松的改动`调用处而非实现处`是不是瞬间世界变得美好了?

## 一些使用场景

上面的代码只是一个使用场景,下面列举几个常见的场景:

* 将一些敏感字符或需要转码的字符过滤,而这个方法并不和业务代码产生耦合。使用`before`几个实现。
* 如本例日志的记录。
* 数据的验证,如果不通过不会执行业务代码,一般为`submit`,并且将逻辑进行了分离。
* 无限的想象力...
* 异常的控制

## 一些展望

在Spring提供的AOP,我们有一个非常强大的功能:`切入点表达式`,比如一下代码:

```js
execution(* com.spring.service.*.*(String,..)) and args(msg,..)
```

我们可以写一个表达式来动态的给函数来绑定一些前置通知,后置通知等。在JavaScript中,我们可以使用正则来完成定义表达式的策略。扫描当前JS的函数后包装函数,要修改功能只需动态的修改配置就可以实现功能的插拔,真正意义上实现JavaScript的AOP!

## 总结

总的来说有一下几点好处:

* 降低模块的耦合度
* 使系统容易扩展
* 更好的代码复用性

使用面向切面编程能将我们的代码逻辑进行分离,将问题细化为单独部分,即可以理解为不可再分割的组件,如上边的日志组件,更好地实现模块化、组件化。还不赶紧重构你的代码?


**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2014-11-11-hello-mobile-aop.md
================================================
---
layout: post
title: 移动Web初级入门
description: "入门移动Web的一些思考"
tags: [移动Web]
image:
  background: witewall_3.png
comments: true
share: true
---

>最好的阅读是输出。 --玉伯

即将开始涉入移动Web了,有点小兴奋也有点小紧张,希望能在未来的团队里带来一些价值。记录一下我现在所认识的移动Web。

## 一些基本名词

初涉移动Web,会有一些基本的名称需要掌握,什么设备像素比呀,移动端Web的内核呀,viewport呀,屏幕的的最小物理单位呀。我已经记录了一些,以后还得继续补充。

- \-  [常见移动Web名词](https://www.zybuluo.com/hacke2/note/45079)

## 关于布局

我们来看看移动端最常见的布局:

<!--more-->

<figure>
	<a href="/images/article/2014-11-10/2.jpg">
		<img src="/images/article/2014-11-10/2.jpg" alt="home" />
	</a>
	<figcaption>上中下三部分布局</figcaption>
</figure>

下面实现上述页面常见移动Web布局三种方法:

* fixed
* absolute
* flexbox

### fixed

对于第一种布局,其实现原理就是header和footer部分都为fixed定位。内容页面可以使用`-webkit-overflow-scrolling:touch`来进行滚动,当然,对于不支持的,也可以使用[iscroll](https://github.com/cubiq/iscroll)来兼容。
fixed布局网上人说坑太多,滚动的时候bug太多,特别是表单元素时弹出输入法会有很多问题,所以不建议使用,以下是一些网上参考的资料:

- \- [移动Web开发实践——解决position:fixed自适应BUG](https://github.com/maxzhang/maxzhang.github.com/issues/11)
- \- [移动端web页面使用position:fixed问题总结](https://github.com/maxzhang/maxzhang.github.com/issues/2)
- \- [移动Web开发,4行代码检测浏览器是否支持position:fixed](https://github.com/maxzhang/maxzhang.github.com/issues/7)

### absolute

和fixed一样,只不过将fixed定位设为绝对定位。设定其left,right等值。下面有一个绝对定位的DEMO。

- \- [绝对定位的DEMO](/demo/mobile/position/absolute.html)

### flexbox

flexbox布局我估计是仿照**flex***布局方式。由于主流移动端都使用的现代浏览器都支持这个CSS3属性。Flexbox布局俗称伸缩布局,它可以简单快速的创建一个具有弹性功能的布局。由于移动多终端的需求,所以首选是flexbox。

- \- [flexbox的DEMO](/demo/mobile/position/flex.html)
- \- [[译]flexbox全揭秘](http://css-tricks.com/snippets/css/a-guide-to-flexbox/)

## 图片与文字

### 非背景图片

之前提到的[常见移动Web名词](https://www.zybuluo.com/hacke2/note/45079),设备像素比:2的高清视网膜技术却会使图片变得模糊,这是为什么呢?

<figure>
	<a href="/images/article/2014-11-10/3.png">
		<img src="/images/article/2014-11-10/3.png" alt="home" />
	</a>
	<figcaption>中密度与超高密度(retina)显示的区别</figcaption>
</figure>

根据计算公式,一个像素点会被拆分成4个小点,显示起来自然模糊了。

解决方案一般有两个:

1.设置`target-densitydpi=device-dpi`,采用按照真实比例来展示,然后进行媒体查询技术如下面代码:

```css
#header {
background:url (medium-density-image.png);
}
@media screen and (- webkit -device-pixel-ratio:1.5) {
/* CSS for high-density screens */
#header { background:url (high-density-image.png);}
}
@media screen and (- webkit -device-pixel-ratio:0.75) {
/* CSS for low-density screens */
#header { background:url (low-density-image.png);}
}
```

这样有一个弊端就是:需要为每一种分辨率书写单独的代码。

2. 假如需要100×100的图片,那么从设计稿(宽为640)上截取200×200的大小,但设置还是100*100。宽720的设计稿 ,为了满足显示像素为360的屏幕。这样就可以来只有一份设计稿只写一份代码了。

另外,多张图片的显示可以进行`canvas`的绘制,进行`GPU`渲染。。

### 背景图片

background-size设置为高度,自适应宽度100%,这也是CSS3的属性。

### 文字

px单位

传统PC端常用的px来设置大小。因为他比较稳定和精确。

em单位

浏览器中放大或缩放浏览页面时会存在一个问题,因为字体大小是固定了的。要解决这个问题,我们可以使用“em”单位。
em有如下特点:

1. em的值并不是固定的;
2. em会继承父级元素的字体大小。

rem单位

`rem`是CSS3的属性,和`em`一样,他的值是不固定的。区别在于他参考的是一个根元素的确定值。`em`是相对于其父元素来设置字体大小的,这样就会存在一个问题,进行任何元素设置,都有可能需要知道他父元素的大小,在我们多次使用时,就会带来无法预知的错误风险。而rem是相对于根元素`html`,这样就意味着,我们只需要在根元素确定一个参考值。

在了解了px,em,rem的区别后,我们可以进行如下设置:

```css
html { font-size: 62.5%; } 
body { font-size: 14px; font-size: 1.4rem; }
```

我们在写大小的时候通过一些简单的计算就可以了,比如的拿到的设计稿有一一部分为18px的文字,那我们在写代码的时候就可以写:

```css
p : {font-size:18px;font-size:1.8rem}/*(1.8 x 10=18)*/
```

## 动画

在移动端不用过多考虑平台端的兼容性,完成动画也是借助CSS3的动画来实现。

在我看来,移动端动画优先选择为以下顺序:

	transition > Animation > js

而且最好使用translate3d强制设备进行`GPU`渲染,但也不能过度使用。
我们可以使用CSS3动画库animate.css玩完成常见的动画。更多关于CSS3动画的可以参考:

- \- [CSS动画简介](http://www.ruanyifeng.com/blog/2014/02/css_transition_and_animation.html)

## 一些事件

移动端原生的最重要的事件`touch` :

* touchstart
* touchmove
* touchend
* touchcancel

其中,他们之间触发的先后顺序为:

	touchstart > touchmove > touchend > click

移动端click会延迟300ms,原因是他在等待判断是不是双击。当然,现在的一些框架解决了这个问题:

- \- [fastclick](https://github.com/ftlabs/fastclick)
- \- [tap.js](https://github.com/alexgibson/tap.js)


用这几个事件可以衍生出很多事件,比如左滑右滑,上下滑屏,放大,缩放等。详情可以看指尖上的JS系列。

- \- [指尖下的js ——多触式web前端开发之一:对于Touch的处理](http://www.cnblogs.com/pifoo/archive/2011/05/23/webkit-touch-event-1.html)
- \- [指尖下的js ——多触式web前端开发之二:处理简单手势](http://www.cnblogs.com/pifoo/archive/2011/05/22/webkit-touch-event-2.html)
- \- [指尖下的js —— 多触式web前端开发之三:处理复杂手势](http://www.cnblogs.com/pifoo/archive/2011/05/22/webkit-touch-event-3.html)

现在已经有一些封装了的框架:

- \- [hammer.js](https://github.com/hammerjs/hammer.js)
- \- [touch.js](https://github.com/Clouda-team/touch.code.baidu.com)

当然还有其他移动端专属的事件,比如:

* 触摸事件
* 屏幕旋转事件

我用原生JS模仿了神马搜索搜出美团后的信息轮播:

- \- [移动端访问](http://www.hacke2.cn/works/demo/sm-meituan/)

## 一些框架

移动端有一些较为成熟框架:

- \- [JQuery Mobile](http://jquerymobile.com/)
- \- [JQTouch](http://jqtouch.com/)

一些公司也有自己的框架

- \- [腾讯Pro](https://github.com/AlloyTeam/Pro)
- \- [百度BlendUI](https://github.com/Clouda-team/BlendUI)

但更多公司选择使用一些基础的类库自己封装一些常见的交互,毕竟在移动端上流量真的是寸土必争。比如神马搜索用的是[zepto.js](http://zeptojs.com/)。通过gzip压缩后只有几k,而且风格与JQ一模一样,无学习成本。

当然还有些为工具框架

- \- [iscroll4](http://cubiq.org/iscroll-4)

## 参考资料

* [jtyjty99999收集移动端开发所需要的一些资源与小技巧](https://github.com/jtyjty99999/mobileTech)
* [[译]flexbox全揭秘](http://www.cnblogs.com/lilyimage/p/3682810.html)
* [移动端重构系列3——整体布局](http://www.w3cplus.com/mobile/mobile-terminal-refactoring-mobile-layout.html)
* [移动端webapp开发必备知识](http://www.qianduan.net/mobile-webapp-develop-essential-knowledge.html)
* [CSS3的REM设置字体大小](http://www.w3cplus.com/css3/define-font-size-with-css3-rem)
* [设备像素比devicePixelRatio简单介绍](http://www.zhangxinxu.com/wordpress/2012/08/window-devicepixelratio/)
* [使用CSS3开启GPU硬件加速提升网站动画渲染性能](http://blog.bingo929.com/transform-translate3d-translatez-transition-gpu-hardware-acceleration.html)

**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2014-11-12-create-github-page.md
================================================
---
layout: post
title: 30秒搭建Github Page
description: "30秒创建和我一样的Github博客"
tags: [分享]
image:
  background: witewall_3.png
comments: true
share: true
---

>如果中国每个程序员都写博客,那么中国IT届的春天就来了

有同学问我的网站是怎么创建的,其实30秒就可以办到。话不多说,大家屏住呼吸,看看能不能坚持30秒:D

## 第一步 fork


我的博客使用的`hpstr-jekyll-theme`,基于`jekyll`的,我们都知道,`Github`是支持`jekyll`的是进入`hpstr-jekyll-theme` 的。

Github 地址:

[https://github.com/mmistakes/hpstr-jekyll-theme](https://github.com/mmistakes/hpstr-jekyll-theme)

点击Fork

<!--more-->

<figure>
	<a href="/images/article/2014-11-11/1.jpg">
		<img src="/images/article/2014-11-11/1.jpg" alt="home" />
	</a>
	<figcaption>单击Fork</figcaption>
</figure>


## 第二步 修改


<figure>
	<a href="/images/article/2014-11-11/4.jpg">
		<img src="/images/article/2014-11-11/4.jpg" alt="home" />
	</a>
	<figcaption>点击设置</figcaption>
</figure>


<figure>
	<a href="/images/article/2014-11-11/3.jpg">
		<img src="/images/article/2014-11-11/3.jpg" alt="home" />
	</a>
	<figcaption>将名字改为`你的Github名字.github.io`</figcaption>
</figure>

### 完了吗?完成了!数一下到底有没有30秒?!

<figure>
	<a href="/images/article/2014-11-11/8.jpg">
		<img src="/images/article/2014-11-11/8.jpg" alt="home" />
	</a>
	<figcaption>成功访问</figcaption>
</figure>


等待几分钟,访问以下

	你的Github名字.github.io

## 一些后续设置

现在你已经有了自己的博客了,当你还可能做以下事情:

1.将google cdn换成 baidu cdn 原因你懂的

2.去掉分享到twitter、facebook等国外社区,加入百度分享

3.加入百度站长助手,方便您的统计

4.配置disqus评论

5.加入Read More功能,不想像以前一样文章全显示出来

上述功能其实我已经给我自己做了配置,你也可以[Fork我的博客](https://github.com/hacke2/hacke2.github.io)。

期待您的文章!

**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2014-11-14-answer-how-to-prepare.md
================================================
---
layout: post
title: 还有一年时间,该如何准备?
description: "回答群友问题"
tags: [问答]
image:
  background: witewall_3.png
comments: true
share: true
---

>群中有朋友问还有一年时间,该如何准备?我回答了一下,仅仅是一孔之见

`群友:`

>我现在css方面看了css那些事儿,css权威指南,正在看精通css;js方面看了javascript高级程序设计,javascript语言精粹;也做了一些页面效果的练习;这周拿了百度偏前端的开发测试实习,但是由于某些原因没办法去。我想知道如果我想明年暑假校招的时候能进BAT的前端部门,现在开始应该偏重看哪些知识点或者书籍?本人现在研二,相对于css更喜欢 js ,希望各位经验丰富的前辈指点迷津,真心喜欢 js 还有就是有必要学习学习 jquery 、nodejs、angularjs 什么吗?

<!--more-->

`重庆-球霸天:`


我其实也是运气好,没什么经验可谈,只是有几个建议:

1.多写DEMO,将你的作品挂到网上去。可以放在github上,[像我一样](http://www.hacke2.cn/works/),也可以[像豪哥一样](http://1.gitapp.sinaapp.com/pro/) 放在sae上,有免费的云豆可拿
还有京东云,都是免费的。个人感觉[更好的基础练习](http://www.fgm.cc/learn/)

2.多多关注一些前端大牛的最新动态(通过微博或微信),看看他们最近在干什么,行业有哪些最近比较关注的知识点。要了解目标公司前端动态,别像我去360面试还不知道成银是谁,他组织的奇舞团和编写的thinkjs.js很出名,如果当时和他聊得欢保证成功率在70%以上。

3.整理自己所学过的知识点,将之形成一个系列,放到博客中,将来面试的时候也展示一下,张鑫旭已经写了无数篇文章了,我在想如果我大一就坚持写博客现在得有多牛啊,其实我们这一行除了技术还有就是文字的产出能力。玉伯说的。

4.要是有项目经验再好不过了,在项目中碰见过过哪些问题,怎么解决的,担任什么样的角色,都是非常非常重要的。我在面试的时候问面试官对我的评价,他说我是他面过的同学对项目是**最深入的一个**。

5.想BAT不会问你有没有使用过这些框架,而会问你这些框架的源码你读过没,那个点是怎么实现的,比如我就被问过JQ和NG的,jq很定要会,如果以后走全栈Node.js要了解,ng可学可不学,因为2.0马上要出来了,与以前风格完全不一样,建议学学backbone(但他其实也不是传统意义的MVC)。

6.还有就是与时俱进,HTML5,CSS3,ES6,都不能比别人落后啊。

一年的时间真的还很长,我真正接触前端也就这么几个月,现在拿自己的水平和前一个月做一个比较,感觉真的不是一个档次。每个月都能感觉到自己的进步,这个感觉很好。祝好运。

最后引用豪哥的总结发言:

>我们走过弯路之后给你的一个人生阶段的结果,人生可能确实需要走一些弯路之后才能真正明白过来人所给的建议。要不然,真不明白里边的坑有多深,需要填多深。

**end from [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2014-11-18-about-responsive.md
================================================
---
layout: post
title: 响应式Web初级入门
description: "关于响应式编程的一些思考"
tags: [移动Web]
image:
  background: witewall_3.png
comments: true
share: true
---

## 跨终端时代的到来

当你乘坐各种交通工具(公交、地铁、轻轨、火车)时你会发现,人们都个个低下头在玩自己的手机、平板、Kindle,没错,你正在处于一个多终端设备的时代!手机用户连年上升,前几天我们在感叹以前玩沙包、陀螺,现在小孩的娱乐就是玩手机--。另外,微软的Xbox和任天堂的Wii等游戏设备也有自己的浏览器。设备真的来了。。

<!--more-->

现在网站主流跨终端的有以下方式:

### 单域

比如[前端乱炖](http://www.html-js.com/)和[我的个人博客](http://www.hacke2.cn)都属于此一类。此类网站具有只编写一次就能实现跨终端的需求,维护起来相当方便。但缺点也很明显,加载不必要的JS和CSS比往常相比巨多。

单域还有一种情况,就是多个模板,你用移动设备可能访问一个网站,最底下会有访问桌面版,访问触屏版等,他会重新加载模板。

<figure>
	<a href="/images/article/2014-11/git.png">
		<img src="/images/article/2014-11/git.png" alt="home" />
	</a>
	<figcaption>提示访问移动版</figcaption>
</figure>

<figure>
	<a href="/images/article/2014-11/git2.jpg">
		<img src="/images/article/2014-11/git2.jpg" alt="home" />
	</a>
	<figcaption>随之进入移动版,HTML结构也会发生变化</figcaption>
</figure>


### 多域

如[神马搜索](http://m.sm.cn)和百度(http://www.baidu.com),当用桌面浏览器和移动浏览器访问的结果是不一样的。其中的手段可能有两种:

* [Ngix反向代理判断](http://blog.csdn.net/fairplay_li/article/details/13769393)
* 服务端直接判断UA输出不同的界面,[JAVA和PHP等后台语言都提供了支持框架](https://github.com/tobie/ua-parser)

两家都对移动端做了专门的页面,这样进行功能的拆减,用户体验当然大大提高,但有需求发生变化时,往往要更改两处地方。

### 多终端

也就是前端最不想看到的,很多公司为了提高更好地用户体验都使用native开发,如IOS的OC,SWIFT,Andriod SDK等。功能强大,接口丰富,缺点就是更新起来异常困难,很多用户都不想过几天就安装一个APP。

**本文主要讲第一种`单域(响应式)`的情况**

### 响应式Web

响应式Web设计最早在2010年EthanMarcotte发表过一篇文章[《Responsive Web Design》](http://www.alistapart.com/articles/responsive-web-design/),**基本每本将响应式的书籍都将他提起,那个例子太经典**提起,文中援引了响应式建筑设计的概念:

>最近出现了一门新兴的学科——"响应式建筑(responsive architecture)"——提出,物理空间应该可以根据存在于其中的人的情况进行响应。结合嵌入式机器人技术以及可拉伸材料的应用,建筑师们正在尝试建造一种可以根据周围人群的情况进行弯曲、伸缩和扩展的墙体结构;还可以使用运动传感器配合气候控制系统,调整室内的温度及环境光。已经有公司在生产"智能玻璃":当室内人数达到一定的阀值时,这种玻璃可以自动变为不透明,确保隐私。

澄清一点,**响应式站点不等同于移动站点**,他只是一种开发移动站点的策略。其实按照这个说法[神马搜索](http://m.sm.cn)是一款纯粹的移动WEB APP,因为它没有桌面版。

<figure>
	<a href="/images/article/2014-11/sm.jpg">
		<img src="/images/article/2014-11/sm.jpg" alt="home" />
	</a>
	<figcaption>为移动而生,专注移动搜索的神马搜索</figcaption>
</figure>

## 三种布局方式

现存的布局哪一种更加适合做响应式的网站呢?一般来说有以下三种布局:

### 固定布局

应该是新手开发人员最喜欢用的布局方式,简单粗暴,设计稿是多少PX,写CSS时就多少PX,对页面的控制力度是最强的,上下级没有联系,想调哪个就调那个,如果设置`box-sizing:border-box;`,甚至对整个布局都没有影响。

最常见的就是`body`使用`960px`的像素,有以下两个因素:

* 适应正方形的老式屏幕;
* 两边补白,让宽屏用户不觉得那么聚集;
* 960可以被3、4、5、6、8、10、12、15整除。

[点击戳DEMO](/demo/2014-11/ali-px.html)

但问题是这么做毫无响应式可言,会出现很恶心的`横向滚动条`,另外,移动端的浏览器会默认的将网页缩小,根本`无多终端性`可言。

### 流式布局

在流式布局中,度量单位不再是简单的像素,而是百分比。这使得页面具有可变性。

[点击戳DEMO](/demo/2014-11/ali-percent.html)

当缩小浏览器边框时,`万恶的横向滚动条`消失了。缺点就是有些文本的行宽会看起来太宽,而在小屏幕看起来太窄

当然,在良好的支持CSS3的移动浏览器下,使用`flex布局`更加有优势!

### 弹性布局

这次度量单位又变了,通常情况以em为单位,但是em太依赖于父级,好在CSS3提供了更好的`rem方式`(这个demo找的不好,因为table表格本来就有流动的属性`display:table;display:table-cell;`)。

[点击戳DEMO](/demo/2014-11/ali-rem.html)

其实细想一下,**选择布局方式其实是对`度量单位`的选择!**

另外还有`网格布局`方式,bootstrap就是采用12栅栏布局,另外前不久winner也谈了一些淘宝提供的可伸缩布局方案:[lib.flexible](https://github.com/amfe/lib.flexible),按照DEMO来看,其使用的是`rem`方式,在改变视窗大小的时候动态的改变基准的比例(浏览器默认是`16px`,设置器基准大小为`62.5%`)。还有人提出来的`混合布局`,但无论哪一种,都离不开上面`固定布局`,`流式布局`,`弹性布局`,三种的支撑。

综上所述,`流式布局`或`弹性布局`或许是响应式布局的更好方式。

## 媒体查询

难道有`流式布局`或`弹性布局`就够了吗?就像一个屌丝升职加薪就够了?不当上CEO怎么赢取白富美?

媒体查询可以让你根据在特定环境下查询到的各种属性值-比如`分辨率`,`色彩深度`,`高度和宽度`(包括设备宽度与视觉宽度),`横向纵向`,`设备像素比`来决定应用什么样的样式。

我们可以看到我们上面的那些DEMO(我承认这个DEMO找的不好,是从今年阿里校招题目里面抠出来的),当我们改变浏览器大小时,左边的列表实在是太丑,但是使用媒体查询后的效果就不一样了。

[点击戳DEMO](/demo/2014-11/ali-media.html)

### 媒体查询的语法

语法很简单


	@media [not|only] type [and] [expr] {
		rules
	}

解释一下:

* not|only:逻辑关键字
* expr:媒体表达式
* type:媒体类型
* rules:CSS样式



1.逻辑关键字

有and,not,or,only等,前三个不多说,最后一个是因为很多较老的浏览器支持媒体类型,却不支持媒体查询,有时候导致浏览器去尝试下载那些你不希望用户看到的样式。

2.媒体表达式

表达式支持的也很多,这里也不列举了,重点有:
* 表示**显示区域**的`width`和`height`
* 表示**设备区域**的`device-width`和`device-height`
* 表示**横屏还是竖屏**的`orientation`
* 表示**设备像素比**`device-pixel-ratio`

3.媒体类型

媒体类型有很多,感兴趣下来查一下,这里就不列举了,一般大多网站设置的是screen,如不你嫌麻烦可以什么都不写(默认为all),支持所有设备。

4.规则

就是你想要在这个环境下想展示出的CSS

下面一个简单的示例:

```css
@media sreen and (min-width: 320px) {
	
}
```


另外,媒体查询也可以使用在外部样式上,如:

```html
<link media="only sceen and (min-width:1300px)" type="text/css" href="style.css">
```

### 关于断点

这里说的断点不是传统意义的调试断点,而是一些常用的`标准宽度`:

* 320px(iPhone和其他一些设备)
* 769px(iPad)
* 1024

依赖这些断点会有一个问题,今天流行的明天未必流行,而且在断点过渡的时候会显得很突兀,所以,确定断点的一个原则是**追随内容**。让设计稿,内容来确定你的断点。

<figure>
	<a href="/images/article/2014-11/luandun.jpg">
		<img src="/images/article/2014-11/luandun.jpg" alt="home" />
	</a>
	<figcaption>前端乱炖的断点</figcaption>
</figure>

### 兼容性

一般的,在IE9一下,加载下列CSS

```html
<!--[if lt IE 9]>
<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<![endif]-->
```

## 图片和视频

### 图片

对于背景图片来说,CSS3有个属性为`background-size`,设置为100%就可以自适应,但是在小屏幕的移动设备加载大图片有点`杀鸡焉用宰牛刀`,一般为了加快速度,我们的策略是:`有选择性的加载图片`,一般会有以下四种方法:

1.万能的媒体查询

只加载与当前屏幕相匹配的图片

2.JS做判断

JS提供了一个方法:`window.matchMedia`,可以把CSS媒体查询作为参数传入,返回相关媒体查询是否匹配的信息。

使用方法:

```js
if(window.matchMedia('(min-width:320px)').matches) {
	//其他代码
}
```

我们可以利用他来加载合适的图片。

3.使用src.sencha.io 

`src.sencha.io`可以传入需要的尺寸和图片地址,自动来压缩图片,使用了CDN+缓存策略技术。当然,我们的服务端也可以自己来实现

<figure>
	<a href="/images/article/2014-11/sencha.jpg">
		<img src="/images/article/2014-11/sencha.jpg" alt="home" />
	</a>
	<figcaption>图片已经被压缩到320px</figcaption>
</figure>

[点击戳图片](http://src.sencha.io/320/http://www.hacke2.cn/images/shiyanshi.jpg)

4.SVG

对于图片伸缩的问题,也可以采用可伸缩矢量图(SGG)来解决。

有关SVG的资料请戳大漠的[w3cplusSVG标签](http://www.w3cplus.com/blog/tags/411.html?u=undefined%26t=%26msgfrom=%26area=msgtext%26clickfrom=3%26clickscene=)。

### 视频

视频的方式与上面类似,可以使用`媒体查询`和`js matchMedia`,当然,用设备看视频的一般是WIFI下,所以直接使用`max-width:100%;height:auto;`也是可以的。如果是连接站外资源,如`优酷`难么,一般解决方法是放到一个iframe里面,详情请看[站外引用的优酷视频,怎样让视频高度自适应?](http://bbs.csdn.net/topics/390600207)

```js
<div style="width:320px;height:180px" >
     <iframe height="100%" width="100%" src="http://player.youku.com/embed/XNjA3NjQ0MzE2" frameborder=0 allowfullscreen></iframe>
</div>
```

## 总结

写到这边,算是对响应式的一个初级入门吧,但个人觉得,做起来原理简单,但**如果设计一个响应式的网站?怎样保证他的高质量?怎么不会影响到速度?已有网站怎么改为相应式的?**这些才是真正值得我们研究的东西。

## 扩展阅读

[CSS3媒体查询](http://www.w3.org/html/ig/zh/wiki/CSS3%E5%AA%92%E4%BD%93%E6%9F%A5%E8%AF%A2)

[媒体查询简介——第1部分:什么是媒体查询?](http://www.infoq.com/cn/news/2011/12/introducing-media-queries)

[什么是响应式Web设计?怎样进行?](http://www.chinaz.com/manage/2011/1121/221607_2.shtml)

[通过CSS3 Media Query实现响应式Web设计](http://developer.51cto.com/art/201201/312206.htm)

[移动优先的跨终端 Web](http://www.imooc.com/learn/43)

[手机淘宝的flexible设计与实现](http://www.html-js.com/article/Like-the-winter-flexible-design-and-implementation-of-the-mobile-phone-Taobao-cold)


**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2014-11-30-gugong.md
================================================
---
layout: post
title: 故宫&国家博物馆之行
description: "北京第一站游记"
tags: [游记]
image:
  background: witewall_3.png
comments: true
share: true
---

>前几天刚来北京,这几天找房子、买东西,做好该准备的工作后(谢谢猪肉在这几天的帮忙),就开始北京景点之旅。第一站选择`故宫`。

早晨11点来到天安门前,做了安检登上了`天安门`。

<figure>
	<a href="/images/article/2014-11/tiananmen.jpg">
		<img src="/images/article/2014-11/tiananmen.jpg" alt="home" />
	</a>
	<figcaption>天安门前</figcaption>
</figure>

<!--more-->

以前在电视前看到的地方今天终于走了上去,等上`天安门`后,感受了当年伟人的视觉。当然,雾霾很严重远方看的还是很不清晰,但能容纳10万人的广场还是能看见。

<figure>
	<a href="/images/article/2014-11/tiananmen2.jpeg">
		<img src="/images/article/2014-11/tiananmen2.jpeg" alt="home" />
	</a>
	<figcaption>天安门上</figcaption>
</figure>

看完一些天安门的介绍,买了票和一张故宫的地图与介绍,然后正式进入紫禁城,一些地方真的是耳熟能详,什么`午门`,`太和殿`,`乾清宫`等等,传说中皇帝上早朝的地方没有想象中的大。

另外,故宫的防火意识挺强的,在很多房子旁边都放了一些`大缸子`,用来防火,而且怕冬天水会冻住,在缸底下也有烧火的。

<figure>
	<a href="/images/article/2014-11/shuigang.jpeg">
		<img src="/images/article/2014-11/shuigang.jpeg" alt="home" />
	</a>
	<figcaption>用来防火的水缸</figcaption>
</figure>

逛了几个展厅,不知不觉就快3小时了,看了看地图,还有几处地方漏了,只能回去再逛一遍,返回的途中看到一个很有特色的巷子,人很少,周围全是`红墙黄瓦`,YY了一下当年太监在这条路上跑路的样子。

<figure>
	<a href="/images/article/2014-11/hongqianghuangwa.jpeg">
		<img src="/images/article/2014-11/hongqianghuangwa.jpeg" alt="home" />
	</a>
	<figcaption>人很少的巷子</figcaption>
</figure>

在停止买票前进入了锡庆门,看到了传说中的`九龙墙`

<figure>
	<a href="/images/article/2014-11/jiulongqiang.jpg">
		<img src="/images/article/2014-11/jiulongqiang.jpg" alt="home" />
	</a>
	<figcaption>传说中的九龙墙</figcaption>
</figure>

后来又看了几个展馆和`珍妃井`,就走出了`神武门`。门口有卖`冰糖葫芦`的,买了一个,真心好吃。

<figure>
	<a href="/images/article/2014-11/bthl.jpg">
		<img src="/images/article/2014-11/bthl.jpg" alt="home" />
	</a>
	<figcaption>北京的冰糖葫芦</figcaption>
</figure>

后来想去`什刹海`,`后海公园`,因为下起雨来就回了,第二天继续这个地方,打算看看广场附近的地方就去还没去的地方,就是这么任性,来到了`天安门广场`。风真的好大。

<figure>
	<a href="/images/article/2014-11/gc.jpeg">
		<img src="/images/article/2014-11/gc.jpeg" alt="home" />
	</a>
	<figcaption>天安门广场</figcaption>
</figure>

结果去的迟了,毛主席纪念堂已经关闭,只能下次再来了。移步到旁边的`国家博物馆`,博物馆内东西太多了,为了细细观赏和感受,所以全程没有照相。

人类历史太久远了,我们不过是滚滚历史长河的一颗小沙粒,想想有点伤感,出来又快6点了,吃了个饭,风太大,就回去了,下次还会来这边,北京能逛得地方是在太多了!

**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2014-11-8-arrow-functions-and-their-scope.md
================================================
---
layout: post
title: 译-ES6箭头函数和它的作用域
description: "关于ES6里箭头函数及其作用域的使用"
tags: [翻译]
image:
  background: witewall_3.png
comments: true
share: true
---

>http://es6rocks.com/2014/10/arrow-functions-and-their-scope/ 原文链接 摇滚ES6中国站快要上线了,大家期待吧,也可以联系[我](https://github.com/hacke2)或者[ES6组织](https://github.com/es6rocks)为这个活动做出点贡献!

在ES6很多很棒的新特性中, 箭头函数 (或者大箭头函数)就是其中值得关注的一个! 它不仅仅是很棒很酷, 它很好的利用了作用域, 快捷方便的在现在使用以前我们用的技术, 减少了很多代码......但是如果你不了解箭头函数原理的话可能就有点难以理解. 所以,让我们来看下箭头函数, 就是现在!

## 执行环境

你可以自己去学习和尝试下, 你可以简单的把示例程序代码复制到你的浏览器控制台下. 现在, 推荐使用Firefox(22+)开发者工具, Firefox(22+)开发者工具现在支持箭头函数,你也可以使用谷歌浏览器. 如果你使用谷歌浏览器, 你必须要做下列两件事:
- \- 在谷歌浏览器中地址栏中输入:"about:flags", 找到 "使用体验性Javascript"选项,开启使用。
- \- 在函数的开头加上"use strict",然后再在你的谷歌浏览中测试箭头函数吧(提示:请用谷歌浏览器v38,我当时就是被浏览器版本坑了):

```js
(function(){
    "use strict";
    // use arrow functions here
}());
```

幸运的是后面会有越来越多的浏览器支持ES6特性. 现在你完成了所有准备工作, 让我们继续深入它吧!

<!--more-->

## 一个新话题

最近大家在讨论关于ES6的一个话题:关于箭头函数, 像这样:

```js
=>
```

## 新的语法

随着讨论产生了一个新的语法:

```js
param => expression
```

新增的语法是作用在变量上, 可以在表达式中申明多个变量, 下面是箭头函数的使用模式:

```js
//  一个参数对应一个表达式
param => expression;// 例如 x => x+2;

// 多个参数对应一个表达式
(param [, param]) => expression; //例如 (x,y) => (x + y);

// 一个参数对应多个表示式
param => {statements;} //例如 x = > { x++; return x;};

//  多个参数对应多个表达式
([param] [, param]) => {statements} // 例如 (x,y) => { x++;y++;return x*y;};

//表达式里没有参数
() => expression; //例如var flag = (() => 2)(); flag等于2

() => {statements;} //例如 var flag = (() => {return 1;})(); flag就等于1

 //传入一个表达式,返回一个对象
([param]) => ({ key: value });
//例如  var fuc = (x) => ({key:x})
        var object = fuc(1);
        alert(object);//{key:1}
```

## 箭头函数是怎么实现的

我们可以把一个普通函数转换成用箭头函数来实现:

```js
// 当前函数
var func = function (param) {    
	return param.split(" ");
}
// 利用箭头函数实现
var func = param => param.split(" ");

```

从上面的例子中我们可以看出箭头函数的语法实际上是返回了一个新的函数, 这个函数有函数体和参数

因此, 我们可以这样调用刚才我们创建的函数:

```js
func("Felipe Moura"); // returns ["Felipe", "Moura"]
```

##  立即执行函数(IIFE)

你能在立即执行函数里使用箭头函数,例如:

```js
( x => x * 2 )( 3 ); // 6
```

这行代码产生了一个临时函数,这个函数有一个形参`x`,函数的返回值为`x*2`,之后系统会马上执行这个临时函数, 将`3`赋值给形参`x`.

下面的例子描述了临时函数体里有多行代码的情况:

```js
( (x, y) => {
    x = x * 2;
    return x + y;
})( 3, "A" ); // "6A"

```

## 相关思考

思考下面的函数:

```js
var func = x => {
    return x++;
};
```

我们列出了一些常见的问题:

**- 箭头函数创建的临时函数的`arguments`是我们预料的那样工作**

```js
console.log(arguments);
```

**- `typeof`和`instanceof`函数也能正常检查临时函数**

```js
func instanceof Function; // true
typeof func; // function
func.constructor == Function; // true
```

**- 把箭头函数放在括号内是无效的**

```js
//  有效的常规语法
(function (x, y){
    x= x * 2;
    return x + y;
} (3, "B") );

// 无效的箭头函数语法
( (x, y) => {
    x= x * 2;
    return x + y;
} ( 3, "A" ) );

// 但是可以这样写就是有效的了:
( (x,y) => {
	x= x * 2;return x + y;
} )( 3,"A" );//立即执行函数
```

**- 尽管箭头函数会产生一个临时函数,但是这个临时函数不是一个构造函数**

```js
var instance= new func(); // TypeError: func is not a constructor
```

**- 同样也没有原型对象**

```js
func.prototype; // undefined
```

## 作用域

这个箭头函数的作用域和其他函数有一些不同,如果不是严格模式,`this`关键字就是指向`window`,严格模式就是`undefined`,在构造函数里的`this`指向的是当前对象实例,如果this在一个对象的函数内则`this`指向的是这个对象,`this`有可能指向的是一个`dom元素`,例如当我们添加事件监听函数时,可能这个`this`的指向不是很直接,其实`this`(不止是`this`变量)变量的指向是根据一个规则来判断的:作用域流。下面我将演示`this`在事件监听函数和在对象函数内出现的情况: 

在事件监听函数中:

```js
document.body.addEventListener('click', function(evt){
    console.log(this); // the HTMLBodyElement itself
});
```

在构造函数里:

```js
function Person () {

    let fullName = null;

    this.getName = function () {
        return fullName;
    };

    this.setName = function (name) {
        fullName = name;
        return this;
    };
}

let jon = new Person();
jon.setName("Jon Doe");
console.log(jon.getName()); // "Jon Doe"
//注:this关键字这里就不解释了,大家自己google,badu吧。
```


在这个例子中,如果我们让Person.setName函数返回Person对象本身,我们就可以这样用:

```js
jon.setName("Jon Doe")
   .getName(); // "Jon Doe"
```

在一个对象里:

```js
let obj = {
    foo: "bar",
    getIt: function () {
        return this.foo;
    }
};

console.log( obj.getIt() ); // "bar"
```

但是当执行流(比如使用了setTimeout)和作用域变了的时候,this也会变。

```js
function Student(data){

    this.name = data.name || "Jon Doe";
    this.age = data.age>=0 ? data.age : -1;

    this.getInfo = function () {
        return this.name + ", " + this.age;
    };

    this.sayHi = function () {
        window.setTimeout( function () {
            console.log( this );
        }, 100 );
    }

}

let mary = new Student({
    name: "Mary Lou",
    age: 13
});

console.log( mary.getInfo() ); // "Mary Lou, 13"
mary.sayHi();
// window

```

当`setTimeout`函数改变了执行流的情况时,`this`的指向会变成全局对象,或者是在严格模式下就是`undefine`,这样在`setTimeout`函数里面我们使用其他的变量去指向`this`对象,比如`self`,`that`,当然不管你用什么变量,你首先应该在setTimeout访问之前,给`self`,`that`赋值,或者使用`bind`方法不然这些变量就是undefined。

这是后就是箭头函数登场的时候了,它可以保持作用域,this的指向就不会变了。

让我们看下上文**起先**的例子,在这里我们使用箭头函数:

```js
function Student(data){

    this.name = data.name || "Jon Doe";
    this.age = data.age>=0 ? data.age : -1;

    this.getInfo = function () {
        return this.name + ", " + this.age;
    };

    this.sayHi = function () {
        window.setTimeout( ()=>{ 
        	// the only difference is here
            console.log( this );
        }, 100 );
    }

}

let mary = new Student({
    name: "Mary Lou",
    age: 13
});

console.log( mary.getInfo() ); // "Mary Lou, 13"
mary.sayHi();
// Object { name: "Mary Lou", age: 13, ... }

```

>分析:在sayHi函数中,我们使用了箭头函数,当前作用域是在student对象的一个方法中,箭头函数生成的临时函数的作用域也就是student对象的sayHi函数的作用域。所以即使我们在setTimeout调用了箭头函数生成的临时函数,这个临时函数中的this也是正确的指向。

##  有趣和有用的使用

创建一个函数很容易,我们可以利用它可以保持作用域的特征:

例如我们可以这么使用:Array.forEach()

```js
var arr = ['a', 'e', 'i', 'o', 'u'];
arr.forEach(vowel => {
    console.log(vowel);
});
```

>分析:在forEach里箭头函数会创建并返回一个临时函数 tempFun,这个tempFun你可以想象成这样的:function(vowel){ console.log(vowel);}但是Array.forEach函数会怎么去处理传入的tempFunc呢?在forEach函数里会这样调用它:tempFunc.call(this,value);所有我们看到函数的正确执行效果。


map里使用箭头函数,这里我就不分析函数执行过程了。。。。

```js
var arr = ['a', 'e', 'i', 'o', 'u'];
arr.map(vowel => {
    return vowel.toUpperCase();
});
// [ "A", "E", "I", "O", "U" ]
```

费布拉奇数列

```js
var factorial = (n) => {
    if(n==0) {
        return 1;
    }
    return (n * factorial (n-1) );
}

factorial(6); // 720
```

我们也可以用在Array.sort方法里:

```js
let arr = ['a', 'e', 'i', 'o', 'u'];
arr.sort( (a, b)=> a < b? 1: -1 );
```

也可以在事件监听函数里使用:

```js
document.body.addEventListener('click', event=>console.log(event, this)); // EventObject, BodyElement
```

## 推荐的链接

下面列出了一系列有用的链接,大家可以去看一看

- \- [Arrow Functions in MDN Documentation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
- \- [TC39 Wiki about Arrow Function](http://tc39wiki.calculist.org/es6/arrow-functions/)
- \- [ESNext](https://github.com/esnext)
- \- [ES6 Tools](https://github.com/addyosmani/es6-tools)
- \- [Grunt ES6 Transpiler](https://www.npmjs.org/package/grunt-es6-transpiler)
- \- [ES6 Fiddle](http://www.es6fiddle.net/)
- \- [ES6 Compatibility Table](http://kangax.github.io/compat-table/es6/)

## 总结

尽管大家可能会认为使用箭头函数会降低你代码的可读性,但是由于它对作用域的特殊处理,它能让我们能很好的处理this的指向问题。箭头函数加上let关键字的使用,将会让我们javascript代码上一个层次!尽量多使用箭头函数,你可以再你的浏览器测试你写的箭头函数代码,大家可以再评论区留下你对箭头函数的想法和使用方案!我希望大家能享受这篇文章,就像你会不就的将来享受箭头函数带给你的快乐.

**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2014-12-2-fe-cut-image.md
================================================
---
layout: post
title: 实习初体验之前端切图
description: "前端切图的一些小技巧"
tags: [PS]
image:
  background: witewall_3.png
comments: true
share: true
---

>以前在实验室做项目图都是美工同学给切好的,结果。。不会,给我一个PSD我竟然不会切--,让同事演示了一下太快了,没好意思再问,最后找`小娟同学`语音演示了一把,才算了解个大概。

首先,我们把PSD加载到PS中。

<figure>
	<a href="/images/article/2014-11/1.png">
		<img src="/images/article/2014-11/1.png" alt="home" />
	</a>
	<figcaption>用PS CS5打开psd文件</figcaption>
</figure>

<!--more-->

用左侧放大镜放大后,点击左侧工具栏,选择自动选择,选择图层

<figure>
	<a href="/images/article/2014-11/2.png">
		<img src="/images/article/2014-11/2.png" alt="home" />
	</a>
	<figcaption>如图选择好</figcaption>
</figure>

选择好那个暂停图标,右侧图层出现了要切出的图片,可以点击那个`眼睛`试一下,点一下如果消失就OK。

<figure>
	<a href="/images/article/2014-11/3.png">
		<img src="/images/article/2014-11/3.png" alt="home" />
	</a>
	<figcaption>我们已经找到了要切的</figcaption>
</figure>

然后我们点击右键

<figure>
	<a href="/images/article/2014-11/4.png">
		<img src="/images/article/2014-11/4.png" alt="home" />
	</a>
	<figcaption>选择复制图层</figcaption>
</figure>

选择目标文档为`新建`,名称起为`stop`

<figure>
	<a href="/images/article/2014-11/5.png">
		<img src="/images/article/2014-11/5.png" alt="home" />
	</a>
	<figcaption>设置好点击确定</figcaption>
</figure>

而后会出来一个透明的图层,然后我们将之前选择的图层进行裁剪。使用快捷键:

`Alt + I +R `

<figure>
	<a href="/images/article/2014-11/6.png">
		<img src="/images/article/2014-11/6.png" alt="home" />
	</a>
	<figcaption>出现一个弹框点击确定</figcaption>
</figure>

现在,我们已经将那个待切除的图片准备好了

<figure>
	<a href="/images/article/2014-11/7.png">
		<img src="/images/article/2014-11/7.png" alt="home" />
	</a>
	<figcaption>那一个小小的暂停按钮</figcaption>
</figure>

然后,我们要将这个图片保存到本地,使用快捷键:

`Ctrl + Alt + R + S `

弹出一个对话框,选择png24,点击存储。
<figure>
	<a href="/images/article/2014-11/8.png">
		<img src="/images/article/2014-11/8.png" alt="home" />
	</a>
	<figcaption>保存我们的小图标</figcaption>
</figure>

关于选择图片格式阿里UED有个不错的文章:[图片格式与设计那点事儿](http://ued.taobao.org/blog/2010/12/jpg_png/)

这样就完成了切图工作。

如何切多个图呢?在选择图层的时候按住`shift`就可以了。

**反思:**该做的还得做,欠下的还是要还的。

**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2014-12-8-my-university-experience.md
================================================
---
layout: post
title: 给学弟学妹说的话
description: "我的大学经历"
tags: [感悟]
image:
  background: witewall_3.png
comments: true
share: true
---

>今天学弟找到我,让我说说大学里的经历,给以后的学弟学妹们可以参考一下。说我其实没啥东西留下的,的确有点装逼了,我确实比较幸运,现在在一个条件相对不错的公司实习,那我就说一些吧。

## 兴趣是最好的老师

有没有兴趣是看你能不能在一行业持久下去的最关键因素。我不相信对IT,没有一点兴趣的人会成为一个巨匠。但是有些同学可能之前没有接触过计算机,没有兴趣,那就强迫自己爱上他。找些相关纪录片,电影看看,看看那些牛人的历程,找一个计算机相关专业的男友,或许你就会爱上计算机:D,如果真的没有兴趣,**至少要找一个以后能养家糊口的本事**。

有了兴趣你可能会加入一些实验室,组织等,会寻求那些与你志同相合的人,这样,`人脉`也有了

## 积累与分享

有了兴趣后,你自己就会不由自主的动起手来了,码点小玩意,分享点小技巧,写点小博客,**每一步都是你的脚印,也是你未来的谈判筹码**。当你花上几年时间看看以前走的脚印,你会感动到自己。

积累和分享最好的手段就是写博客了,以下是我这两年的积累:

* [我以前CSDN的博客 http://blog.csdn.net/hacke2](http://blog.csdn.net/hacke2)
* [我现在Github的博客 http://www.hacke2.cn/](http://www.hacke2.cn/)

`最好的阅读是输出`,将自己所学习到的东西梳理以下,形成文字,再重新认知一遍,你会理解的更加深入。有个程序员听完网上视频后就当场敲一遍,不会了再看看那视频,然后第二天再敲一遍,再一次巩固,获取敲得过程不是很顺利,但是几年坚持下来,真心强大。

还可以加一些高质量的QQ群,在一些论坛上活跃活跃,帮助他人自己也学到了东西,很多都是一线企业的第一手信息,而且顺带混个脸熟:D。

## 实际的项目

如果你能加入实验室,做真实的项目是非常幸运的,但由于实验室空间有限,如果你没能进入实验室也不要紧,跟着其他老师做(如`徐传云老师`,`刘亚辉老师`,`李刚老师`)、其他组织,如我校的`CFC`,或者寒暑假在外面公司实习,或是网上结识伙伴做外包、参加开源项目等。**有些人只会在院长信箱抱怨,而有些人自己寻求出路。**

## 一句话

其他的不说了,谋事在人,成事在天,有些坑必须得自己趟一下才服气,最好送上一句话,祝学弟学妹有一个好的未来:

**不该在最应该努力的年龄选择安逸,不被嘲笑的梦想,没有实现的价值**

**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2014-8-29-hello-memory-leak.md
================================================
---
layout: post
title: JavaScript内存泄漏
description: "进入WEB 2.0 时代,js人们对Web应用有了高更的要求.一个页面很可能数小时不会发生URL跳转,并同时通过Web服务动态的更新页面内容.复杂的事件关联设计、基于对象的JScript和DHTML技术的广泛采用,使得代码的能力达到了其承受的极限.在这样的情况和改变下,弄清楚内存泄露方式变得非常的急迫。那么,为什么会出现内存溢出呢?"
tags: [JavaScript, 内存泄漏]
image:
  background: witewall_3.png
comments: true
share: true
---
# 简介

所谓内存泄露就是内存空间使用完毕之后未回收。在过去Web开发人员并没有太多的去关注内存泄露问题.那时的页面间联系大都比较简单,js使用的功能主要是表单校验,不会有太多关于特效以及业务等方面上的扩展,而进入WEB 2.0 时代,js人们对Web应用有了高更的要求.一个页面很可能数小时不会发生URL跳转,并同时通过Web服务动态的更新页面内容.复杂的事件关联设计、基于对象的JScript和DHTML技术的广泛采用,使得代码的能力达到了其承受的极限.在这样的情况和改变下,弄清楚内存泄露方式变得非常的急迫。那么,为什么会出现内存溢出呢?

<!--more-->
							
# 内存分配与垃圾回收

说道内存泄露,就不得不谈到内存分配的方式。内存分配有三种方式,分别是:

## 静态分配(Static Allocation )

静态变量和全局变量的分配形式。如果把房间看做一个程序,我们可以把静态分配的内存当成是房间里的耐用家具。通常,它们无需释放和回收,因为没人会天天把大衣柜当作垃圾扔到窗外。

## 自动分配( Automatic Allocation )

在栈中为局部变量分配内存的方法。栈中的内存可以随着代码块退出时的出栈操作被自动释放。
这类似于到房间中办事的人,事情一旦完成,就会自己离开,而他们所占用的空间,也随着这些人的离开而自动释放了。

## 动态分配( Dynamic Allocation )

在堆中动态分配内存空间以存储数据的方式。也就是程序运行时用malloc或new申请的内存,我们需要自己用free或delete释放。动态内存的生存期由程序员自己决定。一旦忘记释放,势必造成内存泄露。这种情况下,堆中的内存块好像我们日常使用的餐巾纸,用过了就得扔到垃圾箱里,否则屋内就会满地狼藉。因此,懒人们做梦都想有一台家用机器人跟在身边打扫卫生。在软件开发中,如果你懒得释放内存,那么你也需要一台类似的机器人——这其实就是一个由特定算法实现的垃圾收集器。而正是垃圾收集机制本身策略的一些缺陷,导致了javascript内存泄漏。具体到浏览器中的实现,通常有以下两个策略:

### 标记清除

Javascript最常用的垃圾回收方式是“标记清除”(mark-and-sweep)。当变量进入环境(如在函数中声明了一个变量),则为其标记为“进入环境”;当变量离开环境,则为其标记为“离开环境”。垃圾回收器会定时扫描那些“离开环境”的变量,销毁那些被标记的值并回收它们所占的内存。
除了IE7以前的版本、Netscape Navigate3.0,其他版本的浏览器都用的是标记清除的垃圾回收策略。

### 引用计数

引用计数的含义是跟踪记录每个值被引用的次数,如当声明一个变量并将一个引用类型赋给该变量时,这个值的引用次数就是1,如果这个引用类型赋给另一个变量,它的引用类型加1,。相反,如果第一个变量又引用了其他引用类型时,之前的引用类型的引用次数就减1,直到减成0。当垃圾回收下一次运行的时候,就会释放掉引用次数为0的引用类型的内存。
该方式有一个严重的问题,请看下面例子:

```js
function problem(){
	var objA = {};
	var objB = {}; 
	
	objA.someOtherObject = objB;
	objB.anotherObject = objA;
}
```

objA、objB通过各自的属性相互引用,如果采用引用计数,objA和objB会一直存在。假使这个函数多次被调用,大量内存不能回收,直接导致内存泄漏。

# 常见内存泄漏及解决

## 循环引用(Circular References)

IE浏览器的COM组件产生的对象实例和网页脚本引擎产生的对象实例相互引用,就会造成内存泄漏。这也是Web页面中我们遇到的最常见和主要的泄漏方式;
<br />例:

```js
var element = document.getElementById(“some-element”);
var myobject = {}; 
myobject.element = element;
element.someElement = myobject;
```

在此例中DOM元素与一个原生javascript对象形成循环引用,其中myobject.element指向element元素,element.someElement指向element对象,由于存在这个循环引用,即使将该DOM从页面中移除,它也永远不会被回收。为了避免该问题,最好在使用完毕后手动将其移除:

```js
var element = document.getElementById(“some-element”);
var myobject = {}; 
myobject.element = element;
element.someElement = myobject;
//当使用完后
myobject.element = null;
element.someElement = null;
```

为了解决上述问题,IE9以后将所有的BOM和DOM都转换成了javascript对象,这样,就避免了两种垃圾回收机制都存在的问题,也就消除了常见的内存泄漏的问题。

## 内部函数引用(Closures)

Closures也就是闭包,外部变量可以应用内部函数的局部变量,当外部变量一直引用,那么该局部变量会在内存中一直存在,如果有大量这样的情况,则可能会出现内存泄漏;
<br />例:

```js
function closures() {
	var a = 10;
	return function () {
		return a;
	}
}
var b = closures()();
```

在此例中,closures函数下有个闭包,返回了该函数的局部变量a,外部有一个变量b引用了a,则如果b不释放a,a会一直存在于内存中,解决方法就是在在b使用完后,主动的释放b:

```
function closures() {
	var a = 10;
	return function () {
		return a;
	}
}
var b = closures()();
//b使用完后
b = null;
```

>原文摘自《Web前端案例教材》 ---重庆理工大学创新实验室

<strong>end</strong>

================================================
FILE: _posts/2014-8-29-web-development-process.md
================================================
---
layout: post
title: 高大上Web前端开发环境
description: "前几天做阿里笔试题,最后一个问题是:在前端开发中,经常会遇到调用后端接口的情况,如果我们不想依赖后台的开发环境,比如:本地搭建熟悉的环境,模拟AJAX,说出你的解决方案
记得我当时是这样答的:"
tags: [JavaScript]
image:
  background: witewall_3.png
comments: true
share: true
---
# 起因

前几天做阿里笔试题,最后一个问题是:在前端开发中,经常会遇到调用后端接口的情况,如果我们不想依赖后台的开发环境,比如:本地搭建熟悉的环境,模拟AJAX,说出你的解决方案
记得我当时是这样答的:

<!--more-->

### 若java

	1.使用tomcat环境
	2.使用selvet

```js
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
	resp.getOutputStream().write("{status:'ok',value:'11'}".getBytes("UTF-8"));
	resp.setContentType("text/json; charset=UTF-8");
}
```

### 若php

1.使用wamp 环境   
2.后端PHP构造json数据

```php
echo "{status:'ok',value:'11'}";
//或者
echo json_encode($result);//$result 是数组
```


### 若对数据没有动态提取的要求,则直接放大xxx.json里面

json格式为

```json
{'status':'ok','value':'11'}
```

* 前台使用AJAX请求

```js
function ajax(url, success, fail){
    // 1. 创建连接
    var xhr = null;
    if(window.XMLHttpRequest){
        xhr = new XMLHttpRequest()
    } else {
        xhr = new ActiveXObject('Microsoft.XMLHTTP');
    }
    // 2. 连接服务器
    xhr.open('get', url, true)
    // 3. 发送请求
    xhr.send(null);
    // 4. 接受请求
    xhr.onreadystatechange = function(){
        if(xhr.readyState == 4){
            if(xhr.status == 200){
                success(xhr.responseText);
            } else { // fail
                fail && fail(xhr.status);
            }
        }
    }
}
//请求到数据
var url =  'json.php'...其他地址
ajax(url, function(data) {
    data.status
})
```

后来自己又想了一下,其实这道题就看你平时前端开发的环境是怎样的,因为我是JAVA出生,所以一想就想到了启动一个tomcat来启动一个服务器,上面开启一个sevlet来输出json数据。
总感觉这样太“重量级”了,在网上查了一查,才知道了阿里真实的意图--。

### 先不说阿里意图是什么,先看看现在高大上的前端开发环境:

* 代码编辑工具
* 断点调试工具
* 版本管理工具
* 代码合并和混搅工具
* 依赖管理工具
* 单元测试工具
* 集成测试工具

<strong>你没看错,这不是后端开发环境,这竟然是前端的开发环境!</strong>

下面,我们就来说说<strong>这些工具有哪些,在JAVA里面对应那些工具</strong>

<!--
##代码编辑工具:Sublime Text、WebStrom、HBuilder

<figure>
	<img src="images/2014-8-29-web-development-process/1.jpg" alt=""></a>
	<figcaption>Sublime Text被称为是最性感的代码编辑器,很多插件,体积也很小</figcaption>
</figure>

<figure>
	<img src="images/2014-8-29-web-development-process/2.jpg" alt=""></a>
	<figcaption>HBuilder是国产的一款基于eclipse的IDE,专门编写HTML5/CSS3/JavaScript等</figcaption>
</figure>

<figure>
	<img src="images/2014-8-29-web-development-process/3.jpg" alt=""></a>
	<figcaption>WebStorm,一款非常流行的IDE,可以看这个方法在哪一个浏览器兼容,拥有众多插件</figcaption>
</figure>


## 断点调试工具: FireBug, chrome Debug

<figure>
	<img src="images/2014-8-29-web-development-process/1.jpg" alt=""></a>
	<figcaption>Sublime Text被称为是最性感的代码编辑器,很多插件,体积也很小</figcaption>
</figure>

<figure>
	<img src="images/2014-8-29-web-development-process/2.jpg" alt=""></a>
	<figcaption>HBuilder是国产的一款基于eclipse的IDE,专门编写HTML5/CSS3/JavaScript等</figcaption>
</figure>

## 版本管理工具:Git

<figure>
	<img src="images/2014-8-29-web-development-process/1.jpg" alt=""></a>
	<figcaption>Sublime Text被称为是最性感的代码编辑器,很多插件,体积也很小</figcaption>
</figure>

## 代码合并和混搅工具:Grunt(基于NodeJS)

<figure>
	<img src="images/2014-8-29-web-development-process/1.jpg" alt=""></a>
	<figcaption>Sublime Text被称为是最性感的代码编辑器,很多插件,体积也很小</figcaption>
</figure>

## 依赖管理工具:bower(基于NodeJS)

<figure>
	<img src="images/2014-8-29-web-development-process/1.jpg" alt=""></a>
	<figcaption>Sublime Text被称为是最性感的代码编辑器,很多插件,体积也很小</figcaption>
</figure>

## 单元测试工具:jasmine(基于NodeJS)

<figure>
	<img src="images/2014-8-29-web-development-process/1.jpg" alt=""></a>
	<figcaption>Sublime Text被称为是最性感的代码编辑器,很多插件,体积也很小</figcaption>
</figure>

## 单元测试工具:jasmine(基于NodeJS)Karma自动化完成单元测试

<figure>
	<img src="images/2014-8-29-web-development-process/1.jpg" alt=""></a>
	<figcaption>Sublime Text被称为是最性感的代码编辑器,很多插件,体积也很小</figcaption>
</figure>
-->
<strong>未完待续...</strong>

================================================
FILE: _posts/2014-8-31-javascript-quiz.md
================================================
---
layout: post
title: Javascript Quiz
description: "Javascript Quiz 练习题解析"
tags: [JavaScript]
image:
  background: witewall_3.png
comments: true
share: true
---

### 1.考点:arguments的类型

```js
  (function(){
	  return typeof arguments;
  })();
```

这个题考的是,乍一看arguments可能是一个数组,因为一般可以这样取到:arguments[0]、arguments[1]、arguments[2]
可其实他是类似于jQuery对象的方式,用类来模拟数组,类似于这样的:

```js
  var arguments = {
  	  0 : '第一个参数',
	  1 : '第二个参数',
	  2 : '第三个参数',
	  length : 3,
	  //其他属性或方法
  }
```

所以结果是 'object',默认不为undefined

<!--more-->

### 2.考点:函数的内部属性name

```js
  var f = function g(){ return 23; };
  typeof g();
```

g可选可不选,如果加上,则为函数的内部属性,如调用f.name 输出 g,直接调用会说g未定义

### 3.考点:delete

```js
  (function(x){
      delete x;
      return x;
  })(1);
```

delete 会删除对象的属性,如var a ={ b : 1}; delete a.b;此时打印a为{},但是不会删除形参,输出为1

### 4.考点:赋值顺序

```js
  var y = 1, x = y = typeof x;
  x;
```

基本所有语言都赋值都是从右向左赋值,typeof x得到结果为'undefined',最终赋给y和x,打印出来为'undefined'

### 5.考点:typeof

```js
  (function f(f){
    return typeof f();
  })(function(){ return 1; });
```

typeof的运算数未定义,返回的就是 "undefined". 运算数为数字 typeof(x) = "number" 字符串 typeof(x) = "string" 布尔值 typeof(x) = "boolean" 对象,数组和null typeof(x) = "object" 函数 typeof(x) = "function" 
函数返回为1,输出'number'

### 6.考点:typeof

```js
  var foo = {
    bar: function() { return this.baz; },
    baz: 1
  };
  (function(){
    return typeof arguments[0]();
  })(foo.bar);
```

和上一题类似,将bar函数传进去,arguments[0]指向foo.bar函数,函数指向,但此时this是window对象,window对象下午baz,所以是'undefined'
若将题目改为以下,则返回'number'

```js
  var foo = {
    bar: function() { return this.baz; },
    baz: 1
  };
  (function(){
    return typeof arguments[0].call(foo);
  })(foo.bar,foo);
```


### 7.考点:作用域

```js
  var foo = {
    bar: function(){ return this.baz; },
    baz: 1
  }
  typeof (f = foo.bar)();
```

原因参见上题,输出'undefined'

### 8.考点:逗号表达式

```js
  var f = (function f(){ return "1"; }, function g(){ return 2; })();
  typeof f;
```

输出为 'function' , f执行的结果为函数表达式里最后一个,如在函数表达式再加一个,function h(){return 3},则输出3
如果为非函数则为少一个立即执行函数以下代码,输出b

```js
var f = ('a', 'b');
console.log(f);
```

### 9.考点:JavaScript加性操作符

```js
  var x = 1;
  if (function f(){}) {
    x += typeof f;
  }
  x;
```

参考《javascript 高级程序设计 第三版》 3.5.5章,输出为字符串'1undefined'

### 10.考点:typeof

```js
  var x = [typeof x, typeof y][1];
  typeof typeof x;
```

'string'的typeof 肯定也是'string', 输出为字符串'string'

### 11.考点:不知道考的是啥,文字游戏吧

```js
  (function(foo){
    return typeof foo.bar;
  })({ foo: { bar: 1 } });
```

输出'undefined',如果return typeof foo.foo.bar;为期望值

### 12.考点:函数提升

```js
  (function f(){
    function f(){ return 1; }
    return f();
    function f(){ return 2; }
  })();
```

函数提升了两次,第二次把第一次覆盖了,所以 return 后面的 f 是 return 语句的下一条语句声明的函数 f .

### 13.考点:实例化对象

```js
  function f(){ return f; }
  new f() instanceof f;
```

如果函数无返回值,则返回一个对象的实例,若果有返回值,则为改返回值,输出为false

### 14.考点:with

```js
  with (function(x, undefined){}) length;
```

whth改变了函数的作用域,其实里面的length为函数function(x, undefined){}.length, 函数length表示给函数真正传的参数的个数,为2

>以上题目来源:http://perfectionkills.com/javascript-quiz/

================================================
FILE: _posts/2014-9-1-cqut-paging.md
================================================
---
layout: post
title: JavaScript模仿实验室分页组件
description: "实验室分页组件,一个简单的分页,非AJAX局部刷新"
tags: [小练习, JavaScript]
image:
  background: witewall_3.png
comments: true
share: true
---

# 起因

刚才蔡哥让我重启一下邻水项目服务器,我顺便有回顾了一下去年做的项目。。当时我的任务是园区动态+配置管理,园区动态里有个分页
当时是拿实验室以前项目:泛教育分页组件做的,完全是拿来主义,现在看到,就像用javascript实现一下,没什么技术含量,设计思路也是
至少7年前的,直接一个a标签打开一个连接,将你的当前页数传到后台去。什么时候再做一个AJAX的。

# 分析

邻水分页如下图:
<img src="/images/article/cqut-paging/1.jpg" alt="邻水分页" />
现在数据还不是很多,显示了三条,而且有首页、尾页、上页、下页等辅助按钮,当当前页为第一个时,上页和首页成不可点击状。
当当前页为最后一个时,下页和尾页成不可点击状。
还有以下规则:
* 如果总页数大于10且当前页远离总页数(小于5),则显示5个,后面的省略直到最后一个;
* 总页数大于10且当前页接近总页数(小于总页数-3)则显示后4个;
* 除开上面两个情况,显示当前页前后2页

<!--more-->

# 代码

将page传到后台去取数据,一页显示多少条也在后台弄吧,用a数组存a标签,比字符串拼接快很多,StringBuffer也是按照这个原理实现的。


```js
	function iPage(obj,count,curPage){  
		var href = 'article.do?page=';
		var obj=obj;
		var count=count;
		var curPage=curPage;
		var a=[];
		//总页数少于10 全部显示,大于10 显示前3 后3 中间3 其余....
	
		if(curPage == 1) {
			a.push('<a href="#" class="unclick" >首页</a>');
			a.push('<a href="#" class="unclick" >上页</a>');
		}
		else {
			a.push('<a href="' + href + 1 + '" >首页</a>');
			a.push('<a href="' + href + (curPage-1) + '"  >上页</a>');
		}

		//总页数小于10
		if(count<=10){
			for(var i=1;i<=count;i++){
				createPage(i);
			}
		}else {
			if(curPage <= 4) {//总页数大于10且当前页远离总页数(小于5)
				for(var i = 1; i <=5; i++) {
					createPage(i);
				}
				a.push('...<a href="' + href + count + '">'+count+'</a>')
			}else if(curPage>=count-3){//总页数大于10且当前页接近总页数(小于总页数-3)
				a.push('<a href="' + href + 1 + '">1</a>');
				for(var i=count-4;i<=count;i++){
					createPage(i);
				}
			}else{ //除开上面两个情况
				a.push('<a href="' + href + 1 + '">1</a>...');
				for(var i=curPage-2;i<=curPage+2;i++){
					createPage(i);
				}
				a.push('...<a href="' + href + count + '">'+count+'</a>');
			}
		}

		if(curPage==count){
			a.push('<a href="#" class="unclick">下页</a>');
			a.push('<a href="#" class="unclick">尾页</a>');
		}
		else{
			a.push('<a href="' + href + (curPage + 1) + '">下页</a>');
			a.push('<a href="' + href + count + '">尾页</a>');
		}
		
		obj.innerHTML=a.join("");

		//生成页面
		function createPage(i){
			if(curPage==i){
				a.push('<a href="' + href + i + '" class="on">'+i+'</a>');
			}
			else{
				a.push('<a href="' + href + i + '" >'+i+'</a>');
			}
		}
	}
```


## <a style="color:red" href="/demo/cqut-paging/demo.html" >查看完整DEMO</a>


<img src="/images/article/cqut-paging/2.jpg" alt="我的分页" />

<strong>end</strong>

================================================
FILE: _posts/2014-9-1-oschina-angularjs.md
================================================
---
layout: post
title: 开源中国的 AngularJS 优秀文章汇总
description: "在开源中国看到的,每一篇都是精华"
tags: [小练习, JavaScript]
image:
  background: witewall_3.png
comments: true
share: true
---

>Angular JS (Angular.JS) 是一组用来开发Web页面的框架、模板以及数据绑定和丰富UI组件。它支持整个开发进程,提供web应用的架构,无需进行手工DOM操作。 AngularJS很小,只有60K,兼容主流浏览器,与 jQuery 配合良好。

<image src="http://www.oschina.net/uploads/img/201101/20193253_4wJ1.gif" width="582" height="262" alt="angularJS" />

<!--more-->

<ul><li><p><a href="http://my.oschina.net/blogshi/blog/303758" title="【每日一博】AngularJS 通过 CORS 实现跨域方案">AngularJS 通过 CORS 实现跨域方案</a></p></li><li><p><a href="http://my.oschina.net/blogshi/blog/300595" title="【每日一博】Angular 实现权限控制 - 基于RBAC">Angular 实现权限控制 - 基于RBAC</a></p></li><li><p><a href="http://my.oschina.net/blogshi/blog/293631" title="【每日一博】不可错过的 AngularJS 应用技巧">不可错过的 <span class="highlight">AngularJS</span> 应用技巧</a></p></li><li><p><a href="http://my.oschina.net/ilivebox/blog/289670" title="【每日一博】AngularJS 自定义控件"><span class="highlight">AngularJS</span> 自定义控件</a></p></li><li><p><a href="http://my.oschina.net/blogshi/blog/280400" title="【每日一博】AngularJS 项目构建指南"><span class="highlight">AngularJS</span> 项目构建指南</a></p></li><li><p><a target="_blank" href="http://my.oschina.net/trumanspace/blog/207449">整合jQuery Mobile+AngularJs 经验谈</a></p></li><li><p><a href="http://www.oschina.net/translate/angularjs-performance-improvement" target="_blank" title="AngularJS 性能优化二三事">AngularJS 性能优化二三事</a></p></li><li><p><a href="http://www.oschina.net/translate/developing-a-large-scale-application-with-a-single" target="_blank" title="Developing a Large Scale Application with a Single Page Application (SPA) using AngularJS">Developing a Large Scale Application with a Single Page Application (SPA) using AngularJS...</a></p><p>&nbsp; 使用 AngularJS 开发一个大规模的单页应用(SPA)<em>(已翻译17%)</em></p></li><li><p><a href="http://www.oschina.net/translate/better-ux-with-angularjs-directives" target="_blank" title="改善用户体验的 3 个 AngularJS 指令">改善用户体验的 3 个 AngularJS 指令</a></p></li><li><p><a href="http://www.oschina.net/translate/angularjs-role-based-access-on-gui" target="_blank" title="AngularJS – 实现基于角色访问控制的 GUI">AngularJS – 实现基于角色访问控制的 GUI</a></p></li><li><p><a href="http://www.oschina.net/translate/angularjs-organizing-your-code-with-modules" target="_blank" title="AngularJS —— 使用模块组织你的代码">AngularJS —— 使用模块组织你的代码</a></p></li><li><p><a href="http://www.oschina.net/translate/building-2048-in-angularjs" target="_blank" title="Building the 2048 game in AngularJS">Building the 2048 game in AngularJS</a></p><p>&nbsp; 使用 AngularJS 开发 2048 游戏<em>(已翻译31%)</em></p></li><li><p><a href="http://www.oschina.net/translate/angularjs-the-next-big-thing" target="_blank" title="AngularJS - The next BIG thing">AngularJS - The next BIG thing</a></p><p>&nbsp;&nbsp; AngularJS - 下一个大框架<em>(已翻译62%)</em></p></li><li><p><a href="http://www.oschina.net/translate/custom-directives-in-angularjs" target="_blank" title="AngularJS 的自定义指令">AngularJS 的自定义指令</a></p></li><li><p><a href="http://www.oschina.net/translate/angularjs-filter-creating-custom-filter" target="_blank" title="创建 AngularJS 自定义过滤器,带自定义参数">创建 AngularJS 自定义过滤器,带自定义参数</a></p></li><li><p><a href="http://www.oschina.net/translate/post-data-ngresource-restful-apis-spring-mvc" target="_blank" title="AngularJS —— 使用 ngResource、RESTful APIs 和 Spring MVC 框架提交数据">AngularJS —— 使用 ngResource、RESTful APIs 和 Spring MVC 框架提交数据...</a></p></li><li><p><a href="http://www.oschina.net/translate/setting-up-states-from-a-json-file-in-angularjs-applications" target="_blank" title="在 AngularJS 应用中通过 JSON 文件来设置状态">在 AngularJS 应用中通过 JSON 文件来设置状态</a></p></li><li><p><a href="http://www.oschina.net/translate/angularjs-console" target="_blank" title="通过终端调试 AngularJS 应用">通过终端调试 AngularJS 应用</a></p></li><li><p><a href="http://www.oschina.net/translate/angularjs-seo-with-prerender-io" target="_blank" title="AngularJS 使用 Prerender.io 处理 SEO 的问题">AngularJS 使用 Prerender.io 处理 SEO 的问题</a></p></li><li><p><a href="http://www.oschina.net/translate/angularjs-form-validation" target="_blank" title="AngularJS 的表单验证">AngularJS 的表单验证</a></p></li><li><p><a href="http://www.oschina.net/translate/submitting-ajax-forms-the-angularjs-way" target="_blank" title="AngularJS 提交表单的方式">AngularJS 提交表单的方式</a></p></li><li><p><a href="http://www.oschina.net/translate/handling-checkboxes-and-radio-buttons-in-angular-forms" target="_blank" title="在 AngularJS 应用中处理单选框和复选框">在 AngularJS 应用中处理单选框和复选框</a></p></li><li><p><a href="http://www.oschina.net/translate/animating-angularjs-apps-ngview" target="_blank" title="让你的 AngularJS 应用动起来 : ngView">让你的 AngularJS 应用动起来 : ngView</a></p></li><li><p><a href="http://www.oschina.net/translate/angularjs-ie-compatibility" target="_blank" title="AngularJS 的 IE 兼容性">AngularJS 的 IE 兼容性</a></p></li><li><p><a href="http://www.oschina.net/translate/create-a-laravel-and-angular-single-page-comment-application" target="_blank" title="使用 Laravel 和 Angular 创建一个单页的评论应用">使用 Laravel 和 Angular 创建一个单页的评论应用</a></p></li><li><p><a href="http://www.oschina.net/translate/how-to-use-ngshow-and-nghide" target="_blank" title="如何使用 AngularJS 的 ngShow 和 ngHide">如何使用 AngularJS 的 ngShow 和 ngHide</a></p></li><li><p><a href="http://www.oschina.net/translate/angularjs-multi-step-form-using-ui-router" target="_blank" title="AngularJS 使用 UI Router 实现表单向导">AngularJS 使用 UI Router 实现表单向导</a></p></li><li><p><a href="http://www.oschina.net/translate/scalable-approach-page-transitions-angularjs" target="_blank" title="AngularJS 实现页面切换的一个可伸缩方法">AngularJS 实现页面切换的一个可伸缩方法</a></p></li><li><p><a href="http://www.oschina.net/translate/single-page-apps-with-angularjs-routing-and-templating" target="_blank" title="使用 AngularJS 的路由和模板实现单页应用 (Single Page)">使用 AngularJS 的路由和模板实现单页应用 (Single Page)</a></p></li><li><p><a href="http://www.oschina.net/translate/pretty-urls-in-angularjs-removing-the-hashtag" target="_blank" title="AngularJS 中的友好 URL —— 移除URL 中的 #">AngularJS 中的友好 URL —— 移除URL 中的 #</a></p></li><li><p><a href="http://www.oschina.net/translate/autocomplete-ui-in-angularjs" target="_blank" title="angular-smarty : 一个 AngularJS 的自动完成 UI 实现">angular-smarty : 一个 AngularJS 的自动完成 UI 实现</a></p></li><li><p><a href="http://www.oschina.net/translate/angularjs-hello-world-code-example" target="_blank" title="AngularJS Hello World 代码实例,只需 6 步">AngularJS Hello World 代码实例,只需 6 步</a></p></li><li><p><a href="http://www.oschina.net/translate/track-angular-js-exceptions-automatically" target="_blank" title="如何自动跟踪 Angular.js 的异常">如何自动跟踪 Angular.js 的异常</a></p></li><li><p><a href="http://www.oschina.net/translate/angularjs-support-in-phpstorm" target="_blank" title="PhpStorm 对 AngularJS 的支持">PhpStorm 对 AngularJS 的支持</a></p></li><li><p><a href="http://www.oschina.net/translate/meteor-vs-angular" target="_blank" title="Meteor vs Angular">Meteor vs Angular</a></p></li><li><p><a href="http://www.oschina.net/translate/angularjs-factory-vs-service-vs-provider" target="_blank" title="AngularJS 之 Factory vs Service vs Provider">AngularJS 之 Factory vs Service vs Provider</a></p></li><li><p><a href="http://www.oschina.net/translate/how-to-unit-test-controllers-in-angularjs-without-setting-your-hair-on-fire" target="_blank" title="如何在 AngularJS 中对控制器进行单元测试">如何在 AngularJS 中对控制器进行单元测试</a></p></li><li><p><a href="http://www.oschina.net/translate/sample-mobile-application-with-angularjs" target="_blank" title="使用 AngularJS 开发的移动应用示例">使用 AngularJS 开发的移动应用示例</a></p></li><li><p><a href="http://www.oschina.net/translate/the-angular-way" target="_blank" title="Angular 编程思想 ">Angular 编程思想</a></p></li></ul>
<strong>end</strong>

================================================
FILE: _posts/2014-9-10-level-img-change.md
================================================
---
layout: post
title: 带层次感的图片轮播
description: "带层次感的图片轮播,JavaScript小练习"
tags: [JavaScript, 小练习]
image:
  background: witewall_3.png
comments: true
share: true
---

# 起因

豪哥的JS练习又一波来袭~今天又写了个百度爱玩的东西,暂且叫他带层次感的图片轮播吧


<figure>
	<a href="/images/article/level-img-change/1.jpg">
		<img src="/images/article/level-img-change/1.jpg" alt="home" />
	</a>
	<figcaption>图片可以很有层次感的切换</figcaption>
</figure>

<!--more-->

# 思路

主要思路有二

## 图片大小、位置的计算

我的思路是这样的:

因为首尾切换,我想到的就是自己封装一个循环队列

```js
//封装一个循环队列
function CircularQueue(arr) {
	this.arr = arr || [];
}

//移除前一个,追加到最后
CircularQueue.prototype.shift = function() {
		var temp = this.arr.shift();
		this.arr.push(temp);
	}
//移除最后一个,追加到头部
CircularQueue.prototype.unshift = function() {
		var temp = this.arr.pop();
		this.arr.unshift(temp);
	}
//添加一个元素
CircularQueue.prototype.add = function(obj) {
	this.arr.push(obj);
}
```

现在一个数组里缓存下初始位置的大小,

```js
//初始化ARR数组
var queue = new CircularQueue();
for (var i = 0; i < li.length; i++) {

	queue.add({
		top: parseInt(getStyle(li[i], 'top')),
		left: parseInt(getStyle(li[i], 'left')),
		width: parseInt(getStyle(li[i], 'width')),
		height: parseInt(getStyle(li[i], 'height')),
		zIndex: getStyle(li[i], 'z-index')
	});
}
```

然后在每一个选择项加上mouseover事件,来切换以上图片。

```js
//绑定事件
for (var j = 0; j < links.length; j++) {
	links[j].onmouseover = (function(j, len) {
		return function() {
			//鼠标一上去小点切换
			var k = len - 1;
			for (; k >= 0; k--) {
				links[k].className = 'dot';
			}
			links[j].className += ' dot-active';

			//替换大图片
			var arr = getMiddleArr(j);
			updateStyle(arr);

		}
	})(j, links.length);
}
```

然后通过传入一个数值,得到以改数组为中心的新数组。
因为不能打乱以前的数组,所以我用了深克隆

```js
//深克隆
Object.prototype.clones = function() {
	var o = {};
	for (var i in this) {
		o[i] = this[i];
	}
	return o;
};
Array.prototype.clones = function() {
	var arr = [];
	for (var i = 0; i < this.length; i++)
		if (typeof this[i] !== 'object') {
			arr.push(this[i]);
		} else {
			arr.push(this[i].clones());
		}
	return arr;
};
```



## 缓冲运动

还是用的智联社的运动库,最后将页面元素的样式更新

```js
//调用动作函数绘制
function updateStyle(arr) {
	for (var i = 0; i < li.length; i++) {
		li[i].style.zIndex = arr[i].zIndex;
		startMove(li[i], arr[i]);

	}
}
```


# 代码

全部代码就不贴在博客上了,很简单,没什么可看的,大家可以去我的github上检出


<a target="_blank"  href="https://github.com/hacke2">点击进入我的github</a><br/>

## <a target="_blank"  style="color:red" href="/works/demo/06/" >查看完整DEMO</a>

<strong>end from {{ site.url }}</strong>

================================================
FILE: _posts/2014-9-11-nodeJS-char.md
================================================
---
layout: post
title: 基于Node.js + socket.io实现WebSocket的聊天DEMO
description: "WebSocket Node.js实现版"
tags: [JavaScript, Node.js]
image:
  background: witewall_3.png
comments: true
share: true
---

# 简介

最近看Node.js和HTML5,练手了一个简易版的聊天DEMO,娱乐一下

## 为什么需要socket.io?

node.js提供了高效的服务端运行环境,但是由于浏览器端对HTML5的支持不一,
为了兼容所有浏览器,提供卓越的实时的用户体验,并且为程序员提供客户端与服务端一致的编程体验,
于是socket.io诞生。

	简答来说socket.io具体以下特点:
	
    1.socket.io设计的目标是支持任何的浏览器,任何Mobile设备。目前支持主流的PC浏览器 (IE,Safari,Chrome,Firefox,Opera等),Mobile浏览器(iphone Safari/ipad Safari/android WebKit/WebOS WebKit等)。socket.io基于node.js并简化了WebSocket API,统一了通信的API。它支持:WebSocket, Flash Socket, AJAX long-polling, AJAX multipart streaming, Forever IFrame, JSONP polling。
    
    2.socket.io解决了实时的通信问题,并统一了服务端与客户端的编程方式。启动了socket以后,就像建立了一条客户端与服务端的管道,两边可以互通有无。


<!--more-->

# 代码

创建app.js 源码如下

```js
var fs = require('fs')	//文件操作
    , http = require('http')	//http服务器
    , socketio = require('socket.io');	//socket.io,用来和前台进行交互
  
var server = http.createServer(function(req, res) {
    res.writeHead(200, { 'Content-type': 'text/html'});
    //将index.html输出
    res.end(fs.readFileSync(__dirname + '/index.html'));
}).listen(3000, function() {
    console.log('Listening at: http://localhost:3000');
});

//连接成功的回调  
socketio.listen(server).on('connection', function (socket) {
    socket.on('message', function (msg) {
        console.log('接受到 ', msg);
        //将信息发送给其他客户端
        socket.broadcast.emit('message', msg);
    });
});
```

创建index.html

```html
<html>
<head>
	<meta charset="utf-8">
    <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
    <script src="/socket.io/socket.io.js"></script>
    <script>
        $(function(){
            var iosocket = io.connect();
  
            iosocket.on('connect', function () {
                $('#incomingChatMessages').append($('<li>已连接!</li>'));
  
                iosocket.on('message', function(message) {
                    $('#incomingChatMessages').append($('<li></li>').text(message));
                });
                iosocket.on('disconnect', function() {
                    $('#incomingChatMessages').append('<li>失去连接</li>');
                });
            });
  
            $('#outgoingChatMessage').keypress(function(event) {
                if(event.which == 13) {
                    event.preventDefault();
                    iosocket.send($('#outgoingChatMessage').val());
                    $('#incomingChatMessages').append($('<li></li>').text($('#outgoingChatMessage').val()));
                    $('#outgoingChatMessage').val('');
                }
            });
        });
    </script>
</head>
<body>
控制台:&nbsp;<ul id="incomingChatMessages"></ul>
<br />
<input type="text" id="outgoingChatMessage">
</body>
</html>

```

# 运行&结果

因为依赖了socket.io包,所以用npm 下载

npm install socket.io

最后直接运行

node app.js

<figure>
	<a href="/images/article/1.jpg">
		<img src="/images/article/1.jpg" alt="home" />
	</a>
	<figcaption>运行效果</figcaption>
</figure>


>附上一个实现了很炫聊天DEMO  http://segmentfault.com/a/1190000000479518

<figure>
	<a href="/images/article/2.png">
		<img src="/images/article/2.png" alt="home" />
	</a>
	<figcaption>聊天DEMO</figcaption>
</figure>

<strong>end from <a href="{{ site.url }}"> {{ site.url }}</a></strong>

================================================
FILE: _posts/2014-9-12-css3-lenove.md
================================================
---
layout: post
title: JavaScript实现联想校招员工信息展示
description: "使用简单模板+css3+javascript实现CSS3弹窗及切换"
tags: [JavaScript, 小练习]
image:
  background: witewall_3.png
comments: true
share: true
---

# 起因

今天和豪哥聊天,才知道他是我老乡,而且特别近。。真的感觉他是我的贵人,这是他从
联想校招扣出来的,我们就用JavaScript来实现吧


<figure>
	<a href="/images/article/4.jpg">
		<img src="/images/article/4.jpg" alt="home" />
	</a>
	<figcaption>联想校招员工信息展示</figcaption>
</figure>

<figure>
	<a href="/images/article/3.jpg">
		<img src="/images/article/3.jpg" alt="home" />
	</a>
	<figcaption>点击弹出详细信息</figcaption>
</figure>

<!--more-->

# 过程

给的有HTML还有CSS3,我打算先用前端模板技术讲信息都出来,之前数据是写死在HTML

数据封装在data.js里

```js
var data = [];

data.push({
	'name' : 'Dillon',
	'enname' : 'Dillon',
	'desc' : '来自哈佛的战略伙伴经理',
	'pic' : 'images/n8_10.png',
	'bigpic' : 'images/j2.jpg'
});

data.push({
	'name' : '成俞晟',
	'enname' : 'cheng',
	'desc' : '技术宅服务器工程师',
	'pic' : 'images/n8_07.png',
	'bigpic' : 'images/j3.jpg'
});

data.push({
	'name' : 'Said',
	'enname' : 'Said',
	'desc' : '开朗健谈的中国通',
	'pic' : 'images/n8_18.png',
	'bigpic' : 'images/j5.jpg'
});

//...
```


我们讲以前的HTML写成一个模板

展示区模板

```html
<div id="temp_li" style="display: none;">
	<li data-id="{i}" class="transform">
		<div>
			<i></i>
			<span>{name}</span>
			<p>{desc}</p>
		</div>
		<img src="{pic}">
	</li>
</div>
```

弹出层模板

```html
<div id="dialog"  class="box_ovo ">
	<span id="close" class="close"><i></i></span>
	<span class="prev"><i></i></span>
	<span class="next"><i></i></span>
	<div id="div_temp1" data-id="{i}" >
		<img class="oimg1" src="{bigpic}">
		<div class="ovotxt">
			<div class="ovohead">
				<h1>{name}</h1>
				<i>{enname}</i>
				<em>{desc}</em>
				<span>ECS</span>
			</div>
			<p>2013年加入联想,联想游戏中心最霸气的女商务,性格大大咧咧,柔弱的外表下有一颗强大的心。自诩内可安邦定天下,外可御敌千里外。</p>
			<p>联想游戏中心作为北研最靓丽的风景线,不仅有着最潮、最流行的游戏可以玩,有各种精美的游戏周边随便拿,最关键的是有这样娇(ba)媚(qi)可(shi)人(zu)的女汉子陪聊,陪工作,陪吃饭。总之一句话,联想游戏中心,你值得拥有。</p>
		</div>
	</div>
</div>
```


然后用一下代码弄到HTML里面

```js
//获取LI模板HTML
var tempLi = document.getElementById('temp_li').innerHTML;
//HTML + 数据最后放到这个数组里
var liArr = [];
for (var i = 0; i < data.length; i++) {
	//替换模板里{}表达式
	var itemLi = tempLi.replace(/\{i\}/, i)
					.replace(/\{name\}/,data[i].name)
					.replace(/\{desc\}/,data[i].desc)
					.replace(/\{pic\}/,data[i].pic);
	liArr.push(itemLi);
} 

//加入到ul里
ul.innerHTML = liArr.join('');


//获取详细信息模板
var tempDialog = dialog.innerHTML;

//打开弹出层
function openDialog(dataIndex) {
	dialog.innerHTML = tempDialog.replace(/\{i\}/,dataIndex)
						.replace(/\{name\}/,data[dataIndex].name)
						.replace(/\{enname\}/,data[dataIndex].enname)
						.replace(/\{desc\}/,data[dataIndex].desc)
						.replace(/\{bigpic\}/,data[dataIndex].bigpic);
	bg.className += ' current';
    dialog.className += ' current';
}
```


因为HTML是动态生成的,直接不能加绑定事件,所以使用事件委托

```js
//给每一个li加事件
ul.onclick = function(event) {
	var e = event || window.event;
	var target = e.target || e.srcElement;
	target = getLiByChild(target);
	if(target) {
		var curIndex = target.getAttribute('data-id');
    	openDialog(curIndex);
	}
}	

//给弹出层加事件
dialog.onclick = function(){
	var e = event || window.event;
	var target = e.target || e.srcElement;
	var curIndex = +dialog.lastElementChild.getAttribute('data-id'); 
	//点击关闭
	if(target.nodeName == 'I' && target.parentNode.className == 'close') {
		closeDialog();
	}
	//点击上一个
	if(target.nodeName == 'I' && target.parentNode.className == 'prev') {
		var preIndex= curIndex-1;
		if(preIndex > -1) {
			closeDialog(function() {
				openDialog(preIndex);
			});
		}else {//否则循环到最后一个
			closeDialog(function() {
				openDialog(data.length-1);
			});
		}
		
	}
	
	//点击下一个
	if(target.nodeName == 'I' && target.parentNode.className == 'next') {
		var nextIndex= curIndex+1;
		if(nextIndex < data.length) {
			closeDialog(function() {
				openDialog(nextIndex);
			});
		}else {//否则循环到最后一个
			closeDialog(function() {
				openDialog(0);
			});
		}
	}
    
}
```

其中,弹出层里有三个动作;

1.关闭弹窗
2.前一个
2.后一个

我们在里面做处理,如果是前一个为第一个则跳到最后一个,如果为最后一个则跳到前一个

因为我们点击的时候有可能点到SPAN,有可能点到DIV(原因看展示区模板),所以要有个函数来
找到顶层的LI,因为关闭有一个动画效果,我看了CSS是0.3s,所以我们加一个定时器做一个回调

```js
//找到最顶层LI
function getLiByChild(element) {
	var li = element;
	while(li.nodeName != 'LI') {
		li = li.parentNode;
	}
	return li;
}

//关闭Dialog
function closeDialog(func) {
	bg.className = 'box_bg1';
    dialog.className = 'box_ovo';
    setTimeout(function(){
    	if(dialog.className == 'box_ovo') {
    		func && func();
    	}
    },300);
}
```

# <a target="_blank"  href="https://github.com/hacke2/">获取代码</a><br/>

代码就不贴在博客上了,很简单,没什么可看的,大家可以去我的github上检出

## <a target="_blank"  style="color:red" href="/works/demo/04" >查看完整DEMO</a>

<strong>end from{{ site.url }}</strong>

================================================
FILE: _posts/2014-9-18-no-sleep.md
================================================
---
layout: post
title: 夜未眠
description: "找工作这几天的心声"
tags: [心声]
image:
  background: witewall_3.png
comments: true
share: true
---

<figure>
	<a href="/images/article/5.jpg">
		<img src="/images/article/5.jpg" alt="home" />
	</a>
	<figcaption>图书一角</figcaption>
</figure>

>小时候总觉得「努力」是没有「天赋」的人做的事情;长大了才明白,原来「努力」才是最珍贵的「天赋」。

AL最后HR面试的时候我说了上面的话。

自己以前走的一些弯路,高考那一关很艰难。那一次我终于明白,人,
<strong>不在合适的时候做合适的事情,是要倒霉的</strong>。今天和悦在聊天,她说很多时候,她想干点事情,但又无从下手。
来到这个学校,最让我感激的还是我们创新实验室。因为我想干点事情,而这块地方就是我挥洒热血的地方。
感谢实验室的环境与自己的努力,让我从容的拿到了offer。天时地利人和都有了,我抓住了这次机会。

晚上的时光过的是很快的。每当我累了的时候,就听见昌志的话在耳边响起:“每天7点起来读英语,8点上班,
加班到晚上10点,还得回来啃书到2点,累成狗”。压力不是有人比你努力,而是比你牛叉几倍的人依然比你努力。
你只看到那些光鲜的大牛,但并没有看到大牛在人背后默默的啃书,读代码。这次拿到offer并不是结束,而是才上路。
想想那些比你牛的人在干什么,或许你会关掉正在打开的游戏。

感激高考那一关带来的无助于迷茫,感激那些冷嘲热讽的话语。正是这些,推动我越过高山。
咬牙坚持走过,回头看看,那只是一个插曲。人生并没有难以跨越的鸿沟.经历是一笔无形的财富,
我在享受成长过程带来的收获的同时,在慢慢走向自己最纯真的梦想。

我相信,这个梦,总会实现。


<strong>end from {{ site.url }}</strong>

================================================
FILE: _posts/2014-9-2-what-happens-when-you-type-in-a-url-in-browser.md
================================================
---
layout: post
title: 从输入 URL 到页面加载完成的过程中都发生了什么事情?
description: "what happens when you type in a url in browser,对stackoverflow回答的扩展"
tags: [浏览器, 计算机网络]
image:
  background: witewall_3.png
comments: true
share: true
---

之前阿里有一个笔试题:在在浏览器输入url发生了什么事请,看到<a href="http://stackoverflow.com/questions/2092527/what-happens-when-you-type-in-a-url-in-browser">Stack Overflow</a>有一个很好的资料,
记录了一下,以后做个参考.

	1.browser checks cache; if requested object is in cache and is fresh, skip to #9
	2.browser asks OS for server's IP address
	3.OS makes a DNS lookup and replies the IP address to the browser
	4.browser opens a TCP connection to server (this step is much more complex with HTTPS)
	5.browser sends the HTTP request through TCP connection
	6.browser receives HTTP response and may close the TCP connection, or reuse it for another request
	7.browser checks if the response is a redirect (3xx result status codes), authorization request (401),
		error (4xx and 5xx), etc.; these are handled differently from normal responses (2xx)
	8.if cacheable, response is stored in cache
	9.browser decodes response (e.g. if it's gzipped)
	10.browser determines what to do with response 
		(e.g. is it a HTML page, is it an image, is it a sound clip?)
	11.browser renders response, or offers a download dialog for unrecognized types

<!--more-->

	1.检查浏览器缓存,如果你请求的对象依据缓存下来了,则跳到第9步
	2.浏览器会询问操作系统你请求的服务器的IP
	3.操作系统先查询本地Host文件;如果hosts里没有这个域名的映射,则查找本地DNS解析器缓存;
		如果还是没有,会找TCP/ip参数中设置的首选DNS服务器,查询本地区域文件与缓存;
		如果本地DNS服务器本地区域文件与缓存解析都失效,则根据本地DNS服务器的设置进行查询,
		如果未用转发模式,本地DNS就把请求发至13台根DNS,
		如果开启转发模式,此DNS服务器就会把请求转发至上一级DNS服务器,由上一级服务器进行解析,
		上一级服务器如果不能解析,或找根DNS或把转请求转至上上级,以此循环。最后返回IP给浏览器
	4.浏览器拿到IP后,想会向服务器建立一个socket连接(不考虑https)
	5.浏览器通过TCP向服务器发送HTTP请求的
	6.浏览器接收到服务器响应就会断开TCP连接,或者为了其他请求重用它
	7.浏览器检查响应的状态是重定向(3xx)、要求授权(401)、服务器错误(4xx 和 5xx),如果是正常则会返回2xx(200),
	8.如果是可缓存的,响应则缓存在内存里
	9.浏览器将解码响应(不考虑gzip压缩)
	10.浏览器决定如何响应,例如图片、HTML、媒体文件
	11.浏览器将渲染请求,或者弹出一个下载对话框
	
大家也可以参考下面补充文章:<br/>
<a href="http://ued.ctrip.com/blog/?p=3287">浏览器是怎样工作的(一):基础知识</a><br/>
<a href="http://ued.ctrip.com/blog/?p=3295">浏览器是怎样工作的:渲染引擎,HTML解析(连载二)</a><br/>
<a href="http://tool.oschina.net/commons?type=5">开源中国HTTP状态码常用对照表</a>

<strong>end</strong>

================================================
FILE: _posts/2014-9-26-div-center.md
================================================
---
layout: post
title: CSS居中完全解决方案
description: "各种情景下的CSS水平垂直居中"
tags: [CSS]
image:
  background: witewall_3.png
comments: true
share: true
---

>上次面试面试官问到了,问了个定宽局中和不定宽局中,下来我把所有有关CSS居中都总结了一下


# 水平居中

## 行内元素

把行内元素嵌套在一个DIV中,并且在DIV中设置以下样式

```css
	a{
		text-align: center;
	}
```

## 块级元素

对于定宽的块级元素,我们要设置起margin-top,margin-right 为auto

```css
	.center{
		margin: 0 auto;
	}
```

## 多个块级元素(inline-block)

多个块级元素,我们将其display设置为inline-block;然后将父级元素设置一下属性

<!--more-->

```css
	div{
		text-align: center;
	}
```

## 多个块级元素(flex)

设置需要水平居中的块状元素的父元素display为flex ,并且justify-content属性为center即可

```css
	body{
	  display: flex;
	  justify-content: center;
	}
```

# 垂直居中

## 单行 行内元素

将行内元素的height和line-height设置为一致即可

```css
	a{
	  height: 200px;
	  line-height:200px;  
	}
```

## 多行 行内元素

如果行内元素文字过多产生多行,则在父级元素设置display: table-cell;vertical-align:middle;

```css
	.container{
		width: 300px;
		height: 300px;
		display: table-cell;
		vertical-align:middle;
	}
```

## 已知高度的块级元素

将块级元素设置绝对定位,top为50%,margin-top:-height/2

```css
	div{
	  height: 100px;
	  position: absolute;
	  top: 50%;
	  margin-top: -50px;
	  padding:0; 
	}
```

## 未知高度的块级元素

使用CSS translate,将块级元素设置绝对定位,top为50%,transform: translateY(-50%);

```css
	div{
	  position: absolute;
	  top: 50%;
	  -webkit-transform:translateY(-50%);
	  -moz-transform:translateY(-50%);
	  transform: translateY(-50%);
	  padding:0; 
	}
```

# 水平垂直居中

## 已知高度、宽度的元素

将块级元素设置绝对定位,top为50%,left:50%;margin-top:-height/2;margin-left:-width/2

```css
	div{
		width: 150px;
		height: 150px;
		position: absolute;
		top: 50%;
		left: 50%;
		margin-top: -75px;
		margin-left: -75px;
	}
```

## 已知高度、宽度的元素(flex)

给父级使用flex布局

```css
	div{
		display: flex;
		justify-content:center;
		align-items: center;
	}
```

## 未知高度、宽度的元素

使用CSS translate

```css
	div{
	    position:absolute;
		top:50%;
		left:50%;
		-webkit-transform:translate(-50%,-50%);
		-moz-transform:translate(-50%,-50%);
		transform:translate(-50%,-50%);
	}
```



<strong>end from{{ site.url }}</strong>

================================================
FILE: _posts/2014-9-26-think-in-seo.md
================================================
---
layout: post
title: 和我一起来了解SEO
description: "前端工程师必备的SEO知识"
tags: [SEO]
image:
  background: witewall_3.png
comments: true
share: true
---

# 基础知识

## 搜索引擎

搜索引擎爬虫会检索各个网站,分析他们的关键字,从一个连接到另一个连接,如果爬虫觉得这个关键字是有用的
就会存入<strong>搜索引擎数据库</strong>,反之如果没用的、恶意的、或者已经在数据库的,就会舍弃。搜索引擎数据库
保证是爬虫爬过的最新的数据。用户在使用搜索引擎会在搜索引擎数据库查找关键词,展现给用的的是排序后的结果。除开
某些搜索引擎推广的,剩余的一般是按照关联度来排序。

## SEO简介

SEO(Search Engine Optimization)汉译为搜索引擎优化.seo优化是专门利用搜索引擎的搜索规则来提高目
前网站在有关搜索引擎内的自然排名的方式.SEO的目的理解是为网站提供生态式的自我营销解决方案,让网站在
行业内占据领先地位,从而获得品牌收益.

如在百度搜索hacke2,第一个就是我的前端博客<a href="www.hacke2.cn">www.hacke2.cn</a>

<figure>
	<a href="/images/article/7.jpg">
		<img src="/images/article/7.jpg" alt="home" />
	</a>
	<figcaption>百度搜索hacke2</figcaption>
</figure>

<!--more-->

### 白帽SEO

采用SEO的思维,合理优化网站,提高用户体验,合理与其他网站互联。从而使站点在搜索引擎排名提升。
白帽SEO关注的是长远利益,需要的时间长,但效果稳定。

### 黑帽SEO

就是采用搜索引擎禁止的方式优化网站,影响搜索引擎对网站排名的合理和公正性。同时随时因为搜索引擎
算法的改变而面临惩罚。比如加的关键字与自己网站根本无任何关系,这些关键字一般都是最近最火的关键字
欺骗用户、欺骗爬虫。

### 白帽SEO的相关手段

* 网站标题、关键字、描述
* 网站内容优化
* robot.txt
* 网站地图
* 增加外链引用

一般有关前端工程师的有:网站布局结构优化、网页代码优化。

# 前端SEO

## 网站布局结构优化

网站结构尽量简单、清晰。推荐扁平化结构。相关手段如下:

### 控制首页连接数量

对于中小型网站来说,最好不要太多,但也不能太少

### 扁平化目录层次

爬虫希望看到你网站的结果是树形结构。
如动物-->猫科动物-->狮子

### 导航

导航尽量是文字,而且层级尽量小于三级。如本站导航若为图片,title和alt必须添加

<figure>
	<a href="/images/article/6.jpg">
		<img src="/images/article/6.jpg" alt="home" />
	</a>
	<figcaption>本站导航</figcaption>
</figure>

### 其他

使用面包屑导航、单个页面不超过100k

## 代码

### head

<strong>title</strong> 表示网页的标题
<strong>description</strong> 表示网页的描述
<strong>keywords</strong> 表示网页的关键字

下面是本站的相关描述,右键查看源代码即可看到

```html
<title>hacke2's blog | WEB前端,一路前行 &#8211; hacke2's blog</title>
<meta name="description" content="hacke2的前端技术博客,分享自己的技术心得,积累前段技能,汇聚前端之路的点点滴滴。">
<meta name="keywords" content="hacke2, blog, hacke2 blog, 前端技术, javascript">
```

### 语义化

<a href="http://www.html5jscss.com/html5-semantics-section.html">HTML 5的革新——语义化标签</a>
<a href="http://www.cnblogs.com/yizuierguo/archive/2009/07/26/1531112.html">深更半夜话(html)语义</a>

### 代码优化

<a href="http://www.doc88.com/p-213653269816.html">SEO网页代码优化</a>
<a href="http://www.pc6.com/infoview/Article_32813.html">优化HTML代码加快网页速度</a>


>部分参考百度百科、慕课网

<strong>end from {{ site.url }}</strong>

================================================
FILE: _posts/2014-9-28-gokk.md
================================================
---
layout: post
title: 基于Node.js + jade + Mongoose  模仿gokk.tv 
description: "向goxiazai致敬"
tags: [Node.js]
image:
  background: witewall_3.png
comments: true
share: true
---

# 关于gokk

大学的娱乐活动基本就是在寝室看电影了→_→,一般都会选择去goxiazai.cc上看,里面的资源多,质量高
。站长会推荐评分很高广受好评的电影给大家免费下载,整体来说真是不错,但前两月由于版权问题被迫转型
这也是没办法的事,程序员更应该尊重版权问题,我们也能理解,后来站长又开了gokk个不是给地址让你
下载,而是将网络一些优秀视频站点资源提供出来观看,质量变低了,好怀念以前的goxiazai啊。。

最近在学习Node.js,也看了<a href="https://github.com/congyuandong/imooc">imooc</a>的源码
,自己模仿gokk.tv的前台搭建了一个基于Node.js + Mongoose + Bootstrap,很简单的页面,
花了两天时间,第一次Node体验就交给gokk了,向goxiazai致敬!

<!--more-->

# 展示

<figure>
	<a href="/images/article/11.jpg">
		<img src="/images/article/11.jpg" alt="home" />
	</a>
	<figcaption>首页一</figcaption>
</figure>

<figure>
	<a href="/images/article/12.jpg">
		<img src="/images/article/12.jpg" alt="home" />
	</a>
	<figcaption>首页二</figcaption>
</figure>

<figure>
	<a href="/images/article/13.jpg">
		<img src="/images/article/13.jpg" alt="home" />
	</a>
	<figcaption>详情页</figcaption>
</figure>

<figure>
	<a href="/images/article/14.jpg">
		<img src="/images/article/14.jpg" alt="home" />
	</a>
	<figcaption>新增页</figcaption>
</figure>

# 获取源码

源码托管于git

<a href="https://github.com/hacke2/gokk">点击获取</a>

# 部署于运行

使用npm将项目打包,大家检出来后使用<strong>npm install</strong>即可安装

使用<strong>node app</strong>运行,数据库使用Mongdb,请自行安装,测试数据在test/db.js下

希望您能提出建议或意见

# 数据结构

movies 下面有columnName 表示栏目的名称,如电影、动画、娱乐等 movie是一个数组
里面放入Json对象,表示改栏目下的所有电影,这样非关系数据库的好处就是之前如果遵循低冗余
原则必须建立两张表来使column和movie一对多,后来感觉应该用两个Schema更合理

# 功能

首页、详情页、新增

未实现:分页、查看列表、后台删除、编辑



# 什么原因让我只写了个新增功能?

由于是第一次编写node,在编写的过程中遇到很多问题,虽然node提供了分页limit,但是
只能分一张表内的,比如movies这张表,不能对一条数据低下movie数组集合下分量取出。

后来在<a href="http://cnodejs.org/topic/504b4924e2b84515770103dd">Mongoose学习参考文档——基础篇 </a> 
看到有这么一个东西Sub Docs

>如同SQL数据库中2张表有主外关系,Mongoose将2个Document的嵌套叫做Sub-Docs(子文档)简单的说就是一个Document嵌套另外一个Document或者Documents:

这可能是我想要的,但是第一次开发重点不是在Mongoose上,node的书还不是看的很多,这算是我的
一个学习过程中的小测试吧!计划开发两天时间,如果修改会越陷越深,我明白我现在的node开发流程有很大问题,流程不不正确
。我把在这上面越陷越深,写起来感觉效率真的不是很高,所以其他功能立即停止开发。

这也是项目半成品的一个原因吧


<strong>end from {{ site.url }}</strong>

================================================
FILE: _posts/2014-9-30-nodeJS-sublime-3.md
================================================
---
layout: post
title: 在Sublime Text3 开发Node.js遇到的一个小问题
description: "主要解决了重新运行端口占用的情况"
tags: [Node.js]
image:
  background: witewall_3.png
comments: true
share: true
---


以前的Sublime Text 2包管理出现问题了,不能安装新包,让人开发很捉急,今天装了个3,这个问题解决了

那我们就一起用Sublime Text 3 来玩Node.js吧!

cn node说的很清楚,在这里就不细表

<a href="http://cnodejs.org/topic/51ee453af4963ade0ebde85e">http://cnodejs.org/topic/51ee453af4963ade0ebde85e</a>

这里说说他们说的一个问题

<figure>
	<a href="/images/article/10.jpg">
		<img src="/images/article/10.jpg" alt="home" />
	</a>
	<figcaption>重新运行后端口占用</figcaption>
</figure>

我也是在这边搞了半天,最后用下面方法解决的

<!--more-->

```js
{
	//这里加了一句关闭
	"cmd": ["taskkill /F /IM node.exe", ""],
	"cmd": ["node", "$file"]
}
```


<figure>
	<a href="/images/article/9.jpg">
		<img src="/images/article/9.jpg" alt="home" />
	</a>
	<figcaption>重新运行后端口占用</figcaption>
</figure>

但也出现一个问题,如果你的app.js正在运行,而你在这边调试单元测试,这样会把主程序也会关掉,这个东西
不能常用,还是使用Grunt最为妥当

完整Nodejs.sublime-build

```js
{
  "cmd": ["node", "$file"],
  "file_regex": "^[ ]*File \"(...*?)\", line ([0-9]*)",
  "selector": "source.js",
  "shell":true,
  "encoding": "utf-8",
  "windows":
    {
	"cmd": ["taskkill /F /IM node.exe", ""],
    	"cmd": ["node", "$file"]
    },
  "linux":
    {
        "cmd": ["killall node; node", "$file"]
    }
}
```
    
    

<strong>end from <a href="{{ site.url }}"> {{ site.url }}</a></strong>

================================================
FILE: _posts/2014-9-4-javascript-seamless-handover.md
================================================
---
layout: post
title: JavaScript打造无缝切换
description: "用JavaScrip写的无缝切换,弥补一年前的遗憾"
tags: [JavaScript, 小练习]
image:
  background: witewall_3.png
comments: true
share: true
---

# 起因

一年前写管理学院的时候,那时候做首页有一个幻灯片,由于之前没交流好,CL写的静态页面幻灯片图片是在背景里,让我用jq写,
当时就感觉特别啃爹,图片写在了css里。。好坑爹,自己又懒得改,只能硬着头皮用jq写,一堆临时变量,如num++,各种奇葩,最后加了
个jq淡隐淡出的效果,就交差了,,代码如下:

<script src="https://gist.github.com/hacke2/5434a4346a1169f8b97b.js"></script>

<!--more-->

这几天一个前端qq群主分享了一个东西说平时可以练练手,我没有做,可是看到他说,<strong>群里面有些人小东西不屑做,稍微大点有不会做</strong>
我当时就感觉说我。。刚才写了一下,与大家分享

# 思路

关键一点就是克隆,而且是深克隆,obj.clone(true);这样就能克服该节点的所有子节点。之所以选择克隆,是因为直接删除太突兀了。

一般无缝切换的幻灯片是这样做的

1.点击前一个:将最开始的节点克隆到最后一个节点后面,然后整体向前移,并且删除掉第一个元素

2.点击后一个:将最后节点克隆到最前面的节点钱,然后整体向后移,并且删除掉最后一个元素

动画效果用的智能社的动画脚本

# 代码

代码在github上,有兴趣的看下:

<a target="_blank"  href="https://github.com/hacke2/frontcode">JavaScript打造无缝切换</a><br/>

## <a target="_blank"  style="color:red" href="/demo/javascript-seamless-handover/slide/bd01.html" >查看完整DEMO</a>

<strong>end</strong>

================================================
FILE: _posts/2014-9-4-my-show-4-angularjs.md
================================================
---
layout: post
title: AngularJs+BootStarp+fontAwesome打造个人展示页面
description: "简单的个人展示的界面"
tags: [JavaScript, AngularJs, BootStarp]
image:
  background: witewall_3.png
comments: true
share: true
---

# 起因

实验室马上要出去找工作了,大家想写一个展示自己项目的东西,没必要做的太复杂,我就把这几天学到的结合了一下,算是做了
一个大概的样子出来,大家可以自己放里面加内容


<figure>
	<a href="/images/article/my-show-4-angularJs/1.jpg">
		<img src="/images/article/my-show-4-angularJs/1.jpg" alt="home" />
	</a>
	<figcaption>点击右上角项目名称可切换不同视图</figcaption>
</figure>

<!--more-->

# 所含的技术

## AngularJs

里面MVC使用AngularJs来实现,主要用了其中两个技术:

1.模板技术

2.路由技术

之所以用了AngularJs的路由技术,是因为做一个页面的跳转,之前做开发都是以sevlet或者JAVA MVC框架来做,从后台取数据放到前台,
通过控制器来觉得给用户返回怎样的一个视图,因为这次没必要做的比较复杂,使用AngularJs上两种技术完全能达到我们的要求,而且还是
无刷新的。

## BootStarp

优秀的UI框架,大家做简历或者项目展示的时候可能会想要炫酷的效果:)

## fontAwesome

一款优秀的图标字体库


# 代码

代码就不贴在博客上了,很简单,没什么可看的,大家可以去我的github上检出


<a target="_blank"  href="https://github.com/hacke2/myShow4AngularJs">点击进入github: AngularJs+BootStarp+fontAwesome打造个人展示页面</a><br/>

## <a target="_blank"  style="color:red" href="/demo/my-show-4-angularjs/" >查看完整DEMO</a>

<strong>end from{{ site.url }}</strong>

================================================
FILE: _posts/2015-1-13-what-you-need-to-know-about-block-scope-let.md
================================================
---
layout: post
title: 译-你需要知道的块级作用域 - let
description: "JavaScript 未来声明变量的方式"
tags: [翻译]
image:
  background: witewall_3.png
comments: true
share: true
---

>http://es6rocks.com/2014/08/what-you-need-to-know-about-block-scope-let/ 原文链接

变量声明在任何语言中都是非常基础的东西,理解变量在作用域下如何工作是非常重要的事情。

在大多数语言中,如`Python`,他有两个作用域:局部 和 全局。如下,变量定义在代码开头部分则为全局变量,在函数里面声明变量则为局部变量。

JavaScript也很相似,看以下例子:

<!--more-->

```python
# Python
x = 1 # 全局变量
y = 3

def sum(a, b):
    s = a + b # 局部变量
    return s
```


```js
// JavaScript
var x = 1;  // 全局变量
var y = 3;

function sum(a, b) {
    var s = a + b;  // 局部变量
    return s;
}
```

以C语言为基础而衍生出来的语言(JavaScript, PHP)一般是块级作用域,但JavaScript却不是,当你在一个函数体内声明一个变量,他会在父级或者全局来寻找这个变量,这种行为叫做`变量提升`,与其他语言不同,JavaScript会在`for循环`外面使用这些变量。

看下面这个例子

```js
// JavaScript
for (var i = 0; i <= 2; i += 1) {
    console.log(i); // current i
}
console.log(i); // last i
```

在这个例子中,i竟然可以在循环外面被访问到!这在其他语言是不可思议的!这是很常见的问题,但JS程序员不见得都会关注它。

## let 声明

let在ES6中出现是为了`代替`var。是的,我们的想法是在未来停用`var`,现在就停止时不切实际的,因为有很多网站都还在用它。

使用`let`会像和其他语言大道预期的效果

例子:

```js
let foo = true;
if  (foo) {
    let bar = 'baz';
    console.log(bar); // outputs 'baz'
}

try {
    console.log(bar);
} catch (e) {
    console.log("bar doesn't exist");
}
```

正如你想看到的,`let`会解决在for循环变量的问题。

## 现在的支持

你现在就可以使用let

查看 Kangax 的ES6 支持表格 > http://kangax.github.io/compat-table/es6/#.
let已经在z最新的现代浏览器有所支持( >= IE 11)和[Traceur](https://github.com/google/traceur-compiler)编译器

你可以在火狐开发者工具中试试

![es6 let](http://es6rocks.com/img/let.gif)

注: Michał Gołębiowski 指出在各个浏览器的规范不一样,使用时可能会出现bug。在当前还未正式流行开,这种情况可能会持续到2015年中旬。

## 结论

声明变量虽然简单,但在JavaScript语言中会让初学者头痛的。
`let`声明变量更直观,符合基于c的语言.

var应该停止使用,只有这样,没有变量提示的`let`才能正在运用到未来。


**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2015-1-14-2015-plan.md
================================================
---
layout: post
title: 该是做做计划的时候了!
description: "2015年计划"
tags: [翻译]
image:
  background: witewall_3.png
comments: true
share: true
---

>看着大神们一个个做着年终总结,小菜页凑个热闹,做做2015年的计划

`2014年`就这样过去了,回忆过去,痛苦的相思忘不了。2014年肉果很多,尤为重要的一点:自己走上了前端这一道路。

加了高质量的前端群,认识了很多行内人士,微博关注了很多人,开始玩GitHub了,放弃了在CSDN上的博客,开通了专门前端的Github Page,写了一个作品页,参加了校招面试,拿到了阿里巴巴集团的Offer,现在有做起了移动端WEB编程,前景很大...收获实在是太多了。


在新的一年里,希望能在前端路上有所建树,找到一个重心点深挖,最好通过公司的实际业务需求,学到一下几方面的知识:

## 技术

1.ES6

之前和[ES6 Rocks](http://www.es6rocks.com)联系,希望能创建一个中国版的ES6 Rocks,翻译了几篇文章后,鸟无音讯了,试着再联系联系

2.HTML5和CSS3

借着公司移动端WEB的春风,相信今年在H5上面也会有所建树

3.backbone,ng等MVC框架

还没深入研究过,得好好理解前端MVC在大型WEB应用上的代码组织

4.属于自己的前端框架

一个小心愿,在此期间也会读读其他框架的源码

5.算法

小虫的群里建了一个项目:[每日一题](https://github.com/nunnly/everycode/issues),上面有很多算法上的东西,这一块是我的短板

6.设计

看到那么多人设计的东西,感觉看起来整个人都变好了,每一个毛孔都感觉特别放松,很美。希望能在这方面也入个门

7.读书

在公司感觉整个人都很忙,在北京完全没有看过一本书了,希望能忙里偷闲,看几本书,让自己也智慧点,

## 学业

大学快结束了,在学业上今年最重要的也就是毕业设计,我的选题是《维斯顿智能家居集群版的设计与实现》希望能顺顺利利的通过。

## 健康

看着越来越大的肚子,我在想我怎么年纪轻轻身材就已经像四五十岁的人了?在公司和小伙伴经常一起打乒乓球,玩桌上足球,但我的肚子,还是得有个计划收一收。

## 独立能力&自理能力

以前衣服什么的都是母亲帮我洗,现在在外面,靠不了别人,还是得锻炼自己的独立能力和自理能力。(写这篇博文前刚刚洗了堆积已久的袜子--)

其实最重要的还是计划的执行力和自制力,希望能在2015年有一个质的飞跃!

**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2015-10-21-scroll-in-uc.md
================================================
---
layout: post
title: 在移动端上使用原生滑屏解决方案
description: "解决UC左右滑动BUG"
tags: [Mobile Web]
image:
  background: witewall_3.png
comments: true
share: true
---

>最近有个需求,就是非常简单地横向滑动。打算使用overflow-x:auto;来试验原生滑动,但在安卓版UC下当滑到最左或者最右会`默认启用UC上一页、下一页手势`,导致页面的跳转(原生浏览器无此手势)。之前好几个项目之前视频有使用js处理(query: 夏洛特烦恼), 横向滑动没有加惯性支持,非常卡顿。感觉此类对距离没有要求的滑动用原生最好,而且overflow-x:auto;兼容性支持到安卓2.1以上,使用起来也非常方便,所以打算在UC下做一下适配。

<!--more-->

## 使用css布局

先使用overflow-x:auto;给UL加上一下css,做出横向滑动的效果:

```css
overflow-x: auto;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
```

这样,一个简单地滚动效果就实现了。如图

![css滑动](http://ww4.sinaimg.cn/large/8ae515a4gw1ex7vnx0qpnj20ke066gn4.jpg)

在UC浏览器安卓版下试验,不出所料的滑到最右边启用了UC上一页、下一页手势。

## 解决思路

经过无数次和@绍伟的试验,给`body`绑定`touchmove`事件,并且组织默认行为就能把UC效果干掉,那么就有思路了:

1. 在滑到最左边或者最右边给Body绑定事件,组织默认行为
2. 当手指抬起解绑事件

## 参考代码

具体参考代码如下:


```js
var preventUCDefault = (function() {
    var ua = window.navigator.userAgent,
        startX = 0,
        diffY = 0,
        bindPreventTouch = function() {
            $(document.body).on('touchmove.prevUC', function(e) {
                e.preventDefault();
            });
        },
        isAndroid = (function() {
            //https://github.com/amfe/lib-env/blob/master/src/browser.js#L70
            return (!!ua.match(/(?:UCWEB|UCBrowser\/)([\d\.]+)/) && !!ua.match(/Android[\s\/]([\d\.]+)/));
        })();

    return {
        init : function(ul) {
            if(isAndroid) {
                var scrollWidth = ul[0].scrollWidth;

                ul.on('touchstart.prevUC', function(e) {
                    startX = e.touches[0].pageX;
                });

                ul.on('touchmove.prevUC',function(e) {
                    diffY = e.touches[0].pageX - startX;
                    if($(this).scrollLeft() == 0 && diffY > 0) {
                        //到最左
                        bindPreventTouch();
                    }else if((scrollWidth - $(this).scrollLeft() - ul.width())  === 0 && diffY < 0) {
                        //到最右
                        bindPreventTouch();
                    }
                });

                ul.on('touchend.prevUC',function(e) {
                    $(document.body).off('touchmove.prevUC');
                });
            }
        }
    }
})();


preventUCDefault.init(scope.find('.slide-image ul'));

```


经过QA测试,低版本UC下滑动效果也很不错呢!

## 优化


当然,想开启gpu加速可以加上下句话:

```css
-webkit-transform:translateZ(0);
```

另外,使用原生滑动会出现滚动条,如果想达到极致体验的话,@靳磊给了两个思路:

1. 外面套一层,给定高度+overflow:hidden;
2. 加一个伪元素将滚动条遮起来

使用伪元素代码如下

```css
 ul::after {
    display: block;
    content: "";
    position: absolute;
    z-index: 10;
    width: 100%;
    background-color: #fff;
    height: 10px;
    margin-top : -11px;
}
```

## 总结

对于一个问题一个人思考思维会很局限,和大家一起讨论完成学到了很多解决的办法,能将任务完成最优而且增进团队的融合性。

---

更新 2015年12月14日

隐藏滚动条还有更好地方法

```css
ul::-webkit-scrollbar {
        display: none;
    }
```

主要解决背景非纯色而是虚化这样的需求,uc下有效,但是safari下还是会出现滚动条,有点小遗憾。

**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2015-10-9-javascript-iterables-and-iterators.md
================================================
---
layout: post
title: 译-Javascript中的Iterables和Iterators
description: "ES6迭代器介绍"
tags: [Javascript, ES6]
image:
  background: witewall_3.png
comments: true
share: true
---

>迭代器是es6引入的重要概念(Java中很早就有了),也是理解generator的基础。英文原文:http://jsrocks.org/2015/09/javascript-iterables-and-iterators/


ECMAScript 2015 (ES6) 介绍了两个新的概念,它们密切相关: **iterables** and **iterators**.<br>
希望你在阅读了这篇文章后,会了解到这两个概念的重要性,并且能在日常开发中使用它们。

<!--more-->

## Iterables

可遍历对象:是指实现了[Iterable interface](http://www.ecma-international.org/ecma-262/6.0/index.html#sec-iterable-interface)接口的对象. 可遍历对象会暴露一个遍历方法,我们可以通过这个暴露的方法去自定义遍历行为。

请看下面的demo:

```js
//推荐google浏览器,执行报错的话,说明你的浏览器不支持这两个新的特征,我用的是google chrome v45.0,顺利执行
let iterable = [1, 2, 3];
for (let item of iterable) {
	console.log(item); // 1, 2, 3
}

let iterable2 = new Set([4, 5, 6]);
for (let item of iterable2) {
	console.log(item); // 4, 5, 6
}

let iterable3 = '789';
for (let item of iterable3) {
	console.log(item); // '7', '8', '9'
}

let notIterable = {name:'alibaba'};
for(let item of notIterable){
	console.log(item) // 执行报错!原因很简单,普通Oject并不是可遍历对象
}
```

[for-of](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/for...of) 语法支持可遍历对象, 因此我们可以这种规范的遍历语法去遍历实现了Iterable接口的对象。

### 那Iterable接口到底是个什么东东?

这里的Iterable其实是指一个`[Symbol.iterator]`方法,任何对象只要包含了这个`[Symbol.iterator]`方法,它就是可遍历对象。<br>
如果你不太了解这个ES6新特征Symbol你可以看下这篇文章:[阮一峰:es6 symbols](http://es6.ruanyifeng.com/#docs/symbol)(你也可以看英文文章:[symbols](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Symbol))。<br>
`Symbol.iterator` 是个一个 [*well-known*](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Symbol#Well-known_symbols) (内置于语言内部) Symbol, 他主要用于定义可遍历对象。

在刚才的例子中,我们其实隐式的使用了`[Symbol.iterator]`方法,在Array,Set,String的原型prototype里都包含了`[Symbol.iterator]`方法。比如 [Array](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array), [Set](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Set), [String](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/String) and [Map](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Map) 它们都定义了默认的遍历行为, 然而[Object](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object) 并没这个方法。

Iterable接口允许自定义遍历行为,请看下面的例子,我们讲对象的遍历行为设置为数组的遍历行为,让对象能像数组那样遍历:

```js
let iterable = {
	0: 'a',
	1: 'b',
	2: 'c',
	length: 3,
	[Symbol.iterator]: Array.prototype[Symbol.iterator]
};
for (let item of iterable) {
	console.log(item); // 'a', 'b', 'c'
}
//这个还是比较实用的,毕竟在es5中Oject遍历用for in不是很简洁。
```

现在你可能会问:**"怎样才能自定义遍历行为?"**<br>
我们已经知道:添加一个`[Symbol.iterator]`可以让一个对象变为可遍历的,但是需要注意一点的是:`[Symbol.iterator]`方法必须返回一个 *iterator object* ,就是这个iterator object负责完成遍历逻辑。不要急,在下一个部分我们介绍它的。

在介绍iterators(迭代器)之前,让我们先来回顾下Iterable interface的概念:

- 它意味着可以给使用者一个可遍历的对象(iterable object: "嗨,我有一个`[Symbol.iterator]` 方法.");
- 它会提供一个标准的方法去遍历任何可遍历的对象(iterable object: "亲,你可以调用`[Symbol.iterator]`方法去完成遍历过程").


## Iterators

迭代器对象是指实现了[Iterator interface](http://www.ecma-international.org/ecma-262/6.0/index.html#sec-iterator-interface)的对象,迭代器对象必须拥有一个`next`方法,并且这个方法的返回值必须要是 `{ value: Any, done: Boolean }`这种格式的对象,当我们第一次调用next方法时,next方法会返回第一个遍历结果元素。这个`done`属性是指当前遍历的元素是否是最后一个元素,如果done:true意味着所有遍历完成。

下面例子介绍如何使用遍历器去遍历数组:

```js
let iterable = ['a', 'b', 'c'];


// 获取遍历器
let iterator = iterable[Symbol.iterator]();

//使用next方法遍历元素(好像java遍历器)
iterator.next(); // { value: 'a', done: false }
iterator.next(); // { value: 'b', done: false }
iterator.next(); // { value: 'c', done: false }
iterator.next(); // { value: undefined, done: true }

```

最开始的例子我们不是使用for-of的语法么!现在我们来看一下for-of语法的内部实现方式:

```js
let iterable = ['a', 'b', 'c'];


// 简便语法,利用for-of
for (let item of iterable) {
	console.log(item); // 'a', 'b', 'c'
}

// for-of的内部实现方式,是不是感觉很简单!真的好像java遍历器
for (let _iterator = iterable[Symbol.iterator](), _result, item; _result = _iterator.next(), item = _result.value, !_result.done;) {
	console.log(item); // 'a', 'b', 'c'
}
```

现在我们知道了iterables和iterators后,现在我们可以创建自定义遍历行为的可遍历对象了。首先,我们先来自己实现一个类似数组遍历行为的遍历器:

```js
let iterable = {
	0: 'a',
	1: 'b',
	2: 'c',
	length: 3,
	[Symbol.iterator]() {
		let index = 0;
		return {
			next: () => {
				let value = this[index];
				let done = index === this.length;
				index++;
				return { value, done };
			}
		};
	}
};

//使用for-of语法完成遍历
for (let item of iterable) {
	console.log(item); // 'a', 'b', 'c'
}
```

额,这个看起来是有点复杂,不清晰,但是不要慌,让我们仔细的分析下它。

我们一开始用JavaScript本文化特征语法创建了一个对象。并且用 [computed properties](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer#Computed_property_names) 和 [shorthand methods](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Method_definitions) ES2015 本文化扩展语法给这个对象定义了一个`[Symbol.iterator]`方法,这个对象有了`[Symbol.iterator]`方法,因此他也成了一个可遍历对象。

这个`[Symbol.iterator]`方法实现了默认的遍历行为,这个方法返回了一个遍历器对象,这个遍历器对象包含了上文我们说的next方法,所以我们才能把`[Symbol.iterator]`方法返回的对象视为遍历器对象。

其中`next`方法里面用到了[arrow function](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions),所以next方法里的this才会指向iterable对象。(个人来说,我认为ES6 中箭头函数是最强大,最实用,最能简化现有js开发的新特征之一,个人看法,不喜勿喷)。

next方法返回了一个由value和done属性组成的对象,语法很简洁,很实用,用的是[shorthand properties](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer#Property_definitions)语法,简单来说{value,done}就等于{'value':value,'done':done}。

看到这里,相信你已经完全上面例子里每行代码是怎么工作的了。`for-of`语法会调用 `[Symbol.iterator]`方法来获取遍历器对象,遍历对象里有一个next方法,通过调用next方法遍历元素。

### 有必要把一个遍历接口设计得这么复杂?  
恩,总之是需要的。下面我讲列出最常见的问题和疑惑,并以QA的方式展现给大家。

### Q. 为什么是`[Symbol.iterator]`属性是一个方法,这个方法会返回一个遍历器,而不是这个属性直接就是一个遍历器?

原因是:如果直接是一个遍历器,当你同时想多次遍历时,就不能实现了,同时多次遍历这个可能有点难理解,请看下面的代码:

```js
let iterable = [1, 2, 3, 4];
let iterator1 = iterable[Symbol.iterator]();
let iterator2 = iterable[Symbol.iterator]();

iterator1.next(); // { value: 1, done: false }

iterator2.next(); // { value: 1, done: false }
iterator2.next(); // { value: 2, done: false }
iterator2.next(); // { value: 3, done: false }

iterator1.next(); // { value: 2, done: false }

//可以看到iterator1和iterator2是互不影响的
```

这个例子很勉强,重复遍历相同的数据事时上不太常见。但是异步处理迭代之间的每个值,这在[Koa](http://koajs.com/)和[co](https://github.com/tj/co)中就很好地表现了这一点。尽管它们是利用生成器函数返回的遍历器。

### Q. 为什么遍历器的`next`方法返回一个新的数据结构,而不是直接返回遍历的元素值呢?

在最初的遍历器设计中,这个`next`方法只会返回元素值。那么问题就来了:我怎么知道遍历器已经完成所有的遍历行为呢? 如果让`next`函数抛出一个错误来标明遍历已完成这样又太土了!因为这样你在调用`next`函数时,就必须给它包一层`try/catch`。所以才会让`next`函数返回的数据里有一个`done`属性。

### Q. 为什么遍历器最后一个遍历结果让人感觉有点冗余?

请看下面的代码:

```js
let iterable = [1, 2];

let it = iterable[Symbol.iterator]();


it.next() // { value: "a", done: false }
it.next() // { value: "b", done: false }

//明明只有2个元素,为毛非要遍历三次,才算遍历完成,蛋疼????!!!!
it.next() // { value: undefined, done: true }

```

当`next`方法返回的结果`done`属性为`true`时,遍历才算完成,并且`value`属性的值为`undefined`。遍历器让value和`down:true`的对象为返回值,是为了让这个`down:true`的对象作为一个遍历完成的标志,并不是一个遍历的元素。例如在`for-of`,`Array.from`的内部实现里,它们都会忽略掉这个返回值。

### Q. 我能让遍历器的`next`方法接收参数么?

是的,这样是可以的。请看下面的例子:

```js
let echoIterator = {
	next(value) {
		return { value, done: false };
	}
};

echoIterator.next(42); // { value: 42, done: false }
```

正如上面的例子一样,你在自定义的遍历器里,是可以给next方法配置参数的!但是这种遍历器如果使用`for-of`或`Array.from`这些语法时,就会发生异常,因为`for-of`在调用你的next方法时并不会传递参数给next方法。所以请慎用这种方式。

### Q. 是否可以无限的调用遍历器的遍历方法?

是的,你可以无限的调用遍历器的`next`方法,即使遍历行为已经完成。只是返回的结果都是value=undefined,down=true的对象。


## 可遍历的遍历器(Iterable iterators)

先来一个快速的知识回顾:

- 可变遍历接口要求实现一个`[Symbol.iterator]`方法;
- 遍历器接口需要实现一个`next`方法;

请打开你的脑洞:要是我们让一个对象既有`[Symbol.iterator]`方法,既有`next`方法,那这个对象岂不是成了一个可遍历的遍历器了。

实际上,大多数遍历器都实现了可遍历接口,都有`[Symbol.iterator]`方法,但是请记住:遍历器的`[Symbol.iterator]`方法通常会返回遍历器本身,而不是一个新的遍历器对象。

请看下面的例子:

```js
let iterable = [1, 2];
let iterator = iterable[Symbol.iterator]();


var iterator1 = iterable[Symbol.iterator]();
var iterator2 = iterable[Symbol.iterator]();
iterator1 == iterator2 // false
//为毛iterator1又不等于iterator2了? 亲,iterator1和iterator2是分别由Iterable Oject的`[Symbol.iterator]`方法生成的对象,它们当然不相等了。

var iterator3 = iterator[Symbol.iterator]();
var iterator4 = iterator[Symbol.iterator]();
iterator == iterator3 == iterator4 // true
//iterator3和iterator4都是指向的是iterator,iterator和iterator3和iterator4其实是一个对象所以它们是相等的。

```

这是一个简单的可遍历的遍历器:

```js
let iterableIterator = {

	next() {/*...*/},
	
	[Symbol.iterator]() {
		return this;
	}
};
```

现在你可能会问:**这样有什么用啊? 然并卵?**

好的,现在请思考一个问题: **一个数据源可能需要有多次遍历行为.**<br>
请记住:`for-of`语法的内部实现里,它会重复调用iterable对象的`[Symbol.iterator]`方法来获取iterator.(我这这里其实有一个疑问:为毛for-of的内部实现里,会一直不断的获取iterator,既然iterator的`[Symbol.iterator]`方法方法会返回iterator自身,那还需调用这个方法来获取iterator嘛!这个疑问估计得看真正的for-of的内部实现源码才能明白了)

通过给iterator对象添加`[Symbol.iterator]`方法来返回iterator对象本自身,这样设计很重要的一点就是:`通用`。

怎么解释这个通用呢?

假设现在有一个方法A,方法A接收的参数是一个Iterable Object(方法A是干啥的你先不要关心),但是你现在传递了一个iterator对象给方法A,试想一下如果iterotor对象里没有`[Symbol.iterator]`方法,那方法A肯定不能顺利执行了。所以当给iterator对象添加`[Symbol.iterator]`方法后,任何需要参数为Iterable object的函数,你传给这个函数一个iterator对象,这个函数还是能正常work。希望我这样解释`通用`大家能明白。


```js
let arr = ['a', 'b'];
let keysIterator = arr.keys(); // 获取遍历器

keysIterator[Symbol.iterator]() === keysIterator; // `keysIterator` 就是一个 Iterable iterator

//for-of会重复的调用`keysIterator[Symbol.iterator]()`,来获取`keysIterator`
//之后遍历它
for (let key of keysIterator) {
	console.log(key); // 0, 1 (the array indexes)
}

```

## 可能会中枪的小细节

因为iterator的`[Symbol.iterator]`方法会返回iterator自身,所以我们在用的时候一定要小心这个问题,不然代码执行出错了就坑爹了。

请看下面的例子:

```js
let iterable = [1, 2, 3, 4];

let iterator = iterable[Symbol.iterator]();

//先手动的遍历2次
iterator.next();
iterator.next();

//再调用for-of去遍历
for (let item of iterator) {
	console.log(item); // 3, 4
	//注意了这里只遍历了2次,并不会从头开始遍历
}

//如果你想从头开始遍历,你可以这样写
for (let item of iterable[Symbol.iterator]()) {
	console.log(item); // 1, 2, 3, 4
}
```

原因就不在多说了,相信大家都懂的。


## 总结

啊啊啊啊啊!谢谢你看完了这篇文章!希望我的介绍没问题,让你理解了iterables和iterators。

恩,文章差不多结束了,可能你有想继续学习ES6的内容,你可以看下,下一篇文章:[Generators](http://www.ecma-international.org/ecma-262/6.0/index.html#sec-generatorfunction-objects)。

最后如果你想改善一下这篇文章,请点击这里:[JS Rocks repository](https://github.com/JSRocksHQ/jsrockshq.github.io)(额,这是英文原文),我们将会很高兴地与你讨论并接纳你的意见。

至于文章知识点总结就省略了,希望大家不要打我...


## 参考

- [ECMAScript® 2015 Language Specification - Ecma International](http://www.ecma-international.org/ecma-262/6.0/index.html)
- [for...of - MDN](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/for...of)
- [Iteration protocols - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols)
- [for-of reimplementation - Babel](http://babeljs.io/repl/#?experimental=false&evaluate=true&loose=false&spec=false&playground=true&code=let%20iterable%20%3D%20%5B'a'%2C%20'b'%2C%20'c'%5D%3B%0D%0Afor%20%28let%20item%20of%20iterable%29%20%7B%0D%0A%09console.log%28item%29%3B%20%2F%2F%20'a'%2C%20'b'%2C%20'c'%0D%0A%7D%0D%0A&runtime=true)
- [Symbol - MDN](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Symbol)
- [Object initializer - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer)
- [Method definitions - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Method_definitions)
- [Arrow functions - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)

**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2015-11-17-use-node-build-static-blog.md
================================================
---
layout: post
title: 使用Node.js生成一个静态博客
description: "静态博客wooden编写记录"
tags: [Node,Javascript, ES6]
image:
  background: witewall_3.png
comments: true
share: true
---

>我github star最多的是我的博客,是用Ruby写的Jekyll搭建的,运行在支持它的gthub上。Jekyll很方便的一点是可以用markdown来编写你的博客,有一种极客的感觉。但是用Node.js怎么实现一个静态博客系统呢?

<!--more-->

![github](http://ww2.sinaimg.cn/large/8ae515a4jw1ey4ctqpvhaj20sc02m0sz.jpg)

## 生成模板

首先要解决的问题是怎么用命令行来做一些操作。我打算用命令行生成模板,有一个模块`commander`实现很方便。
定义一个帮助命令

```js
program
	.command('help')
	.description('show help')
	.action(() => {
		program.outputHelp();
	});
```

在定义其他命令

```js

program
	.command('create [dir]')
	.description('create empty project')
	.action(require('../lib/create'));

program
	.command('preview [dir]')
	.description('preview your web page')
	.action(require('../lib/preview'));

program
	.command('build [dir]')
	.description('build the project to HTML')
	.option('-o, --output <dir>', 'build the project dir')
	.action(require('../lib/build'));

program.parse(process.argv);

```

我们定义了三条命令:

1. 创建
2. 预览
3. 生成

## 创建

在创建的时候会把之前的一些模板文章生成到用户文件下,因为本模块是安装在全局的,运行该命名会把一些静态资源文件、模板、配置文件等输出出来供用户修改。

```js

try {
	  	//create template dir
		fse.mkdirsSync(path.resolve(dir, '_layout'));
		fse.mkdirsSync(path.resolve(dir, '_post'));
		fse.mkdirsSync(path.resolve(dir, 'assets'));
		fse.mkdirsSync(path.resolve(dir, 'posts'));

		// 复制模板文件
		let tplDir = path.resolve(__dirname, '../tpl');
		fse.copySync(tplDir, dir);

		console.log('create success!');
	}catch(e) {
		console.log('create faild!');
		console.error(e);
	}
	
```

## 预览

预览就是用express启动一个web项目。开启一个Node.js web项目最简单无异于是用express框架了。我是用jade当做模板引擎,因为其提供的block和include实在是太强大了。

```js

	let app = express();


	app.use('/assets', express.static(path.join(__dirname, '../assets')));
	
	app.set('port', (process.env.PORT || 3000));

	app.set('views', path.join(__dirname, '../_layout/pages'));
	app.set('view engine','jade')
	
```

我们设置好静态目录和模板引擎,就可以编写重要的路由了。在一个简单的博客系统,无外乎有两个重要的路由:

* 首页
* 文章详情页

对应路由如下:

```js
//render index
	app.get('/', (req, res, next) => {
		//...
	});

//render article
app.get('/posts/:articleName', (req, res, next) => {
	//...
});
```

最后,我们想启动的时候就能打开默认浏览器,这里,我参考了一下[新杰的代码](https://github.com/freeyiyi1993/mobile-test/blob/master/server.js#L25):

```js
// open browers
	app.listen(app.get('port'), () => {

		let cmd = 'open "http://localhost:' + app.get('port') + '/"';

	    child_process.exec(cmd, (err, stdout, error) => {
	        if(err) {
	            console.log('error:' + error)
	        } else {
	            let url = 'http://localhost:' + app.get('port') + '/'
	            console.log('Server started: ' + url)
	        }
	    })
	})
```

### 解析markdown

解析markdown Node.js已经提供了封装好得模块`markdown-it`,我们设置参数调用就可以直接调用。

```js
let md = new MarkdownIt({
    html: true,
    langPrefix: 'code-',
});
```

一篇文章应该有他的一些特征,比如像Jekyll一样:标题、标签、背景图等。

我在markdown下有如下设置:

```html
---
title : 我是标题
---
```

然后需要有一个[函数来解析](https://github.com/hacke2/wooden/blob/master/lib%2Futils.js#L55)

最后得到标题,我们命名文章的规则是日期+标题,和jekyll一样。

也需要解析一下

```js
let getArticleDate = title =>{
    let arr = title.split('-'),
    result = [];

    for (let i = 0; i < 3; i++) {
        result[i] = arr[i];
    }
    return result.join('-');
}
```

### 异步调用

我们得到数据后,会将它给到jade,这是一个异步的过程,我用`Promise`来封装

下面是的获取首页

```js
let getArticle = name => {
    return new Promise((resolve, reject) => {
        
        let file = path.join(process.cwd(), '_post', name + '.md');
        fs.readFile(file, (err, data) => {
            if(err) {
                reject(err);
            }else {
                let article = parseSourceContent(name, data.toString());
                let html = md.render(article.content);
                resolve({
                    name : config.name,
                    contact : config.contact,
                    title : article.title,
                    content : html,
                    date : article.date,
                    href : article.href
                });
            }
        });
        
    })
}
```

下面是的获取某一篇文章

```js
let getArticle = name => {
    return new Promise((resolve, reject) => {
        
        let file = path.join(process.cwd(), '_post', name + '.md');
        fs.readFile(file, (err, data) => {
            if(err) {
                reject(err);
            }else {
                let article = parseSourceContent(name, data.toString());
                let html = md.render(article.content);
                resolve({
                    name : config.name,
                    contact : config.contact,
                    title : article.title,
                    content : html,
                    date : article.date,
                    href : article.href
                });
            }
        });
        
    })
}
```

### 渲染jade

jade提供个强大的include 和 block。我们创建一个框架,其他页面继承它。

```jade
doctype
html
	head
		meta(charset="utf-8")
		meta(name="viewport",content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no")
		title #{name}
		include ./includes/css
		block page_css
	body
		include ./includes/header
		block content
		include ./includes/js
		block page_js
```

它包含css模板和js模板,页面放在content里

```jade
block content
```

首页来继承它

```jade
extends ../layout

block page_css
	link(href="assets/css/base.css",rel="stylesheet")
	link(href="assets/css/index.css",rel="stylesheet")

block content
	h1.site-name #{name}
	article.container
		ul.article-list
			each article in articleList
				li(class="article")
					a(href="#{article.href}#{isBuild ? '.html' : ''}", class="article-title") #{article.title}
					div.abstract #{article.abstract}
```

文章列表也也是如此,在此不展开了。

可以看出,预览是比较重要的一步,生成也是基于它来运作的。

## 生成

我们在创建新的md文件后,需要将它编译成html,也是调用之前预览的方法来生成html。

```js
utils.getIndexData().then(data => {

		data.isBuild = true;
		
		console.log('build ' + path.join(viewPath, 'index.jade'))
		let html = jade.renderFile(path.join(viewPath, 'index.jade'), data);
		fse.outputFileSync(path.join(outputDir, 'index.html'), html);
	});
	
	//build post
	utils.getFileList().forEach(filePath => {
		let fileName = path.basename(filePath, '.md');
		utils.getArticle(fileName)
			.then(data => {
				console.log('build ' + path.join(viewPath, 'post.jade'))
				let html = jade.renderFile(path.join(viewPath, 'post.jade'), data);
				fse.outputFileSync(path.join(outputDir, 'posts', fileName + '.html'), html.toString('utf-8'));
			});
		
	});
```

## 发布

想让这个命令不是用Node xxx.js来运行,直接是用xxx来运行,需要在bin目录下创建一个文件,将commande这个入口js拷进去,然后在开头输入

```shell
#!/usr/bin/env node --harmony
```

因为此项目运用了es6的一些特性,需要使用`--harmony`来开启支持。

最后,使用`npm publish`发布,我已经将它发布在npm上了,起名`wooden`[https://www.npmjs.com/package/wooden](https://www.npmjs.com/package/wooden)。将一个demo部署在了开发机上[http://fe.sm.cn/xinglong.wangwxl/wooden/](http://fe.sm.cn/xinglong.wangwxl/wooden/)


![WOODEN](http://ww3.sinaimg.cn/large/8ae515a4jw1ey4cjpkywzj20xl0bkwf9.jpg)

## 遇到的一个坑

之前写项目都是用`__dirname`找当前目录,但是使用这种直接命令这种方式`__dirname`找到的是全局安装的路径,并不是当前命令执行的路径,最后路径会找不到,可以使用`process.cwd()`来找到当前命令执行的路径。

本文就此完毕,是不是和我现有博客的架构挺像?

项目地址:[https://github.com/hacke2/wooden](https://github.com/hacke2/wooden)

**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2015-2-25-Variables-and-scoping-in-ECMAScript-6.md
================================================
---
layout: post
title: 译-ES6里的变量和作用域
description: "在ES6中变量和作用域的使用方法"
tags: [翻译]
image:
  background: witewall_3.png
comments: true
share: true
---

>http://www.2ality.com/2015/02/es6-scoping.html 原文链接

在本文将有大量的例子介绍在ES6中作用域和变量的使用方法

## 1.块级作用域的let和const

让`let`和`const`创造块级作用域,他仅仅存在于包裹他们的最内层的块。下面代码演示了使用`let`修饰的`tmp变量`仅仅存在于最里层的`if`申明里。

```js
function func() {
    if (true) {
        let tmp = 123;
    }
    console.log(tmp); // tmp未定义
}
```

相比之下,用var申明的变量在函数级作用域

<!--more-->

```js
function func() {
    if (true) {
        var tmp = 123;
    }
    console.log(tmp); // 123
}
```

块级作用域意味着你在函数里只要是两个不同的块,那么变量名称可以重复。(原文为**影子变量**)

```js
function func() {
    let foo = 5;
    if (···) {
        let foo = 10; // shadows outer `foo`
        console.log(foo); // 10
    }
    console.log(foo); // 5
}
```

## 2.`const`创建不可变的变量

由`let`创建的变量是可变的

```js
let foo = 'abc';
foo = 'def';
console.log(foo); // def
```

`const`创建变量是不可变的

```js
const foo = 'abc';
foo = 'def'; // TypeError
```

注意,`const`并不影响所赋的值是否可变,如果所赋的值是一个对象,那么并不能保证该对象不变。他只是保存一个对象的引用。

```js
const obj = {};
obj.prop = 123;
console.log(obj.prop); // 123

obj = {}; // TypeError
```

如果你想改变量是真正不可变的,那么直接[冻结他的值](http://speakingjs.com/es5/ch17.html#freezing_objects)

```js
const obj = Object.freeze({});
obj.prop = 123; // TypeError
```

### 2.1 循环体内的const

一旦`const`变量创建,那么他就不能改变。但这并不意味着你不能重新声明一个新值,比如在循环体内。

```js
function logArgs(...args) {
    for (let [index, elem] of args.entries()) {
        const message = index + '. ' + elem;
        console.log(message);
    }
}
logArgs('Hello', 'everyone');

// Output:
// 0. Hello
// 1. everyone
```

### 2.2 什么时候我该使用let,什么时候该使用const?

```js
const foo = 1;
foo++; // TypeError
```

如果你想创建的可变变量为基本类型,则,不能使用const。

不过你可以使用`const`修饰引用类型的变量。

```js
const bar = [];
bar.push('abc'); // array是可变的
```

按照最佳实践,一般会把常量(真正不变的)使用大写来表示。

```js
const EMPTY_ARRAY = Object.freeze([]);
```

## 3.临时禁区(TDZ)

被`const`和`let`修饰的变量我叫做它是`临时禁区` (TDZ)。当进入这个作用域,外界就无法访问这些被修饰的变量知道运行结束。

使用`var`修饰的变量没有TDZ。

* 当进入有`var`修饰的变量的作用域中,会在内存中立即创建空间,立即初始化变量,并且设置成`undifined`。
* 在执行过程中如遇到赋值关键字则给变量赋值,否则还是为`undifined`。

使用`let`关键字的拥有TDZ,这意味着它的生命周期如下:

* 当进入有`let`修饰的变量的作用域中,会在内存中立即创建这个变量,不会初始化这个变量。
* 获取或设置未初始化的变量会导致引用错误(ReferenceError).
* 在执行过程中如遇到声明处则初始化且给变量赋值,如果不赋值则为undefined。

`const`的机制与`let`相似,但他必须赋一个值且不能被改变。

在TDZ中,如果获取或者设置一个未初始化会抛出异常。

```js
if (true) { // 一个新的作用域, TDZ 开始
    //tmp未初始化
    tmp = 'abc'; // ReferenceError
    console.log(tmp); // ReferenceError

    let tmp; // TDZ 结束, `tmp` 被初始化为 `undefined`
    console.log(tmp); // undefined

    tmp = 123;
    console.log(tmp); // 123
}
```

下面例子演示了TDZ是临时的(基于时间)的而不是基于位置的:

```
if (true) { // 一个新的作用域, TDZ 开始
    const func = function () {
        console.log(myVar); // OK!
    };

    // 在这里已经进入了TDZ,访问 `myVar` 会导致 ReferenceError

    let myVar = 3; TDZ 结束
    func(); // called outside TDZ
}
```

### 3.1TDZ的类型检查

一个变量不能再TDZ里访问意味着你也不能在该变量使用`typeof`

```js
if (true) {
    console.log(typeof tmp); // ReferenceError
    let tmp;
}
```

我不认为这将在实践中是一个问题。因为你不能有条件的给某一个作用域加上`let`修饰符。事实上你仍然可以使用`var`修饰符创建全局变量

```js
if (typeof myVarVariable === 'undefined') {
    // `myVarVariable`不存在,则创建它
    window.myVarVariable = 'abc';
}
```

## 4.在循环体的头部中使用`let`修饰符

在循环体中,你每次迭代重新绑定用`let`修饰的变量。允许你这样做的循环:`for`, `for-in`和`for-of` 。

```js
if (typeof myVarVariable === 'undefined') {
    let arr = [];
    for (let i=0; i < 3; i++) {
        arr.push(() => i);
    }
    console.log(arr.map(x => x())); // [0,1,2]
}
```

相比之下,用var声明的循环体中,,每次迭代室友一个单一的值

```js
if (typeof myVarVariable === 'undefined') {
    let arr = [];
    for (var i=0; i < 3; i++) {
        arr.push(() => i);
    }
    console.log(arr.map(x => x())); // [3,3,3]
}
```

为每次迭代得到一个新的绑定似乎有些奇怪,但当你使用循环创建函数(例如回调事件处理)它是非常有用。

## 5.形参

### 5.1 形参和局部变量

如果你声明的变量名正好与形参一致,那么会爆出一个静态错误

```js
function func(arg) {
    let arg; // static error: duplicate declaration of `arg`
}
```

在函数里面再嵌套一个块则会避免这个问题

```js
function func(arg) {
    {
        let arg; // 影子参数 `arg`
    }
}
```

相比之下,用`var`修饰的与形参同名的变量不会出现错误,表现的形式是覆盖了形参。

```js
function func(arg) {
    var arg; // does nothing
}
```

```js
function func(arg) {
    {
        var arg; // does nothing
    }
}
```

### 5.2 默认形参与TDZ

如果形参有默认值,他们被当做一个序列

```js
// OK: 声明之后访问x
function foo(x=1, y=x) {
    return [x, y];
}
foo(); // [1,1]

// 异常,在YDZ里试图访问y
function bar(x=y, y=2) {
    return [x, y];
}
bar(); // ReferenceError
```

### 5.3 默认形参与TDZ

形参默认值的范围是独立于body的作用域(前者围绕后者)。这意味着“inside”定义的方法或函数参数的默认值不知道body的局部变量。

```js
// OK: 在x已经声明后y访问x
function foo(x=1, y=x) {
    return [x, y];
}
foo(); // [1,1]

// 异常: `x` 试图在TDZ访问 `y`
function bar(x=y, y=2) {
    return [x, y];
}
bar(); // ReferenceError
```

## 6.全局对象

JS中的全局对象(浏览器是`windows`,Node.js是global)的bug比特性还要多,尤其在性能这一块,这也就是不奇怪ES6有以下描述:

* 全局对象的属性都是全局变量。在全局范围,`var` 和 `function` 声明创建这些属性
* 是全局变量但不是全局对象的属性。在全局范围,`let` 和 `const`, `Class` 声明创建这些属性

## 7.函数的声明和类的声明

函数声明:

* 块级作用域,像`let`
* 在全局对象创建属性(在全局范围),像var。 
* 声明提升:独立的一个函数声明中提到它的范围,它总是创建之初的范围

下面代码解释了声明提升

```js
{ // Enter a new scope

    console.log(foo()); // OK, due to hoisting
    function foo() {
        return 'hello';
    }
}
```

类的声明:

* 块级作用域
* 不会再全局对象上创建属性
* 不会声明提升

类不升起可能令人惊讶,因为他们创建函数。这种行为的理由是,他们继承条款定义的值通过表达式,表达式必须在适当的时间执行。

```js
{ // 进入新的作用域
    
    const identity = x => x;

    //这儿是`MyClass`的TDZ
    let inst = new MyClass(); // ReferenceError

    //注意 `extends`
    class MyClass extends identity(Object) {
    }
}
```

## 8.扩展阅读

1.[Using ECMAScript 6 today](http://www.2ality.com/2014/08/es6-today.html)

2.[Destructuring and parameter handling in ECMAScript 6](http://www.2ality.com/2015/01/es6-destructuring.html)

**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2015-3-13-anmi-strange-problem.md
================================================
---
layout: post
title: Zepto CSS方法一个奇怪的现象
description: "Zepto CSS方法一个奇怪的现象"
tags: [心声]
image:
  background: witewall_3.png
comments: true
share: true
---

今天写活动页,打算封装一个JS逐帧运动的组件,但在调试的时候发现使用以下代码会出现问题:

```css
curAnim.css({
    'background-position' : '-' + i * 75 + 'px 0px'
})
```

<!--more-->

在Chrome 模拟器下没任何问题,但是在iphone6下会出现一闪一闪的问题,百思不得其解,后来用JS原生方法解决了。

```js
curAnim[0].style.backgroundPosition = "-" + i * 75 + "px 0px";
```

在iphone6也正常了。

查阅了以下Zetop的css方法,其核心代码如下:

```js
var css = ''
if (type(property) == 'string') {
if (!value && value !== 0)
  this.each(function(){ this.style.removeProperty(dasherize(property)) })
else
  css = dasherize(property) + ":" + maybeAddPx(property, value)
} else {
for (key in property)
  if (!property[key] && property[key] !== 0)
    this.each(function(){ this.style.removeProperty(dasherize(key)) })
  else
    css += dasherize(key) + ':' + maybeAddPx(key, property[key]) + ';'
}

return this.each(function(){ this.style.cssText += ';' + css })
```

我上一句其实正在起作用的是下面:

```js
this.style.cssText += ';' + css;
```

于是我想,是不是`this.style.cssText`和`this.style.backgroundPosition`的区别?于是了然了:**cssText因为重新这设置了这个元素样式的会让浏览器将这个元素的整个都repaint+reflow,效率当然要比之变换一个样式的低**,算是分析完了,若对一个元素多次操作还是使用原生JS为妙。

**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2015-3-20-css-multi-row-overflow.md
================================================
---
layout: post
title: 小tip:CSS3控制多行溢出
description: "打破CSS只能控制单行溢出的历史观点"
tags: [CSS3]
image:
  background: witewall_3.png
comments: true
share: true
---

>以前做项目,对文字溢出只能进行单行溢出的控制:

```css
white-space: nowrap;  
overflow: hidden;  
text-overflow: ellipsis;  
```

对于多行则无能为力,只能用渲染端来控制,这样有一个很大的问题:**无法达到响应式**

但是在WebKit浏览器或移动端(绝大部分是WebKit内核的浏览器)的页面实现比较简单,可以直接使用WebKit的CSS扩展属性(WebKit是私有属性)-webkit-line-clamp,这个历史问题也就不攻自破了,对应代码:

<!--more-->

```css
@media all and (-webkit-transform-3d){
    .3-line{
       white-space:normal;  
       -webkit-line-clamp:3;  //表限制三行
       display:-webkit-box;  
       overflow: hidden;
       text-overflow:ellipsis;
       -webkit-box-orient: vertical; 
    }
}
```

对应SCSS代码如下:

```scss
/**
  * multi lines overflow
  * @param {Number} $lineCount - count to display
  */
@mixin multiline-ellipsis($lineCount){
    @media all and (-webkit-transform-3d){
        &{
           white-space:normal;  
           -webkit-line-clamp:$lineCount;  
           display:-webkit-box;  
           overflow: hidden;
           text-overflow:ellipsis;
           -webkit-box-orient: vertical; 
        }
    }
}
```


加这段媒体查询的原因是考虑只在webkit下用。直接引用这个代码片段传入参数即可。

对于过渡方案,有以下几种:

1.使用伪元素生成一个“...”(最好半透明背景),父元素定高`overflow:hidden`

2.以上功能由JS来代替[Clamp.js](https://github.com/josephschmitt/Clamp.js)


**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2015-3-23-frame-animation.md
================================================
---
layout: post
title: 逐帧动画两种实现方式
description: "分别用JS/CSS实现逐帧动画"
tags: [CSS3]
image:
  background: witewall_3.png
comments: true
share: true
---

>由于使用gif,我们不能将其控制(播放、暂停、播放次数),所以逐帧动画一般使用代码实现,下面我们来介绍两种方法。

**原理就是时时刻刻改变他的`position`**。

<!--more-->

## 1.JS逐帧动画

JS就是调用定时器,这边有一个小技巧:直接改变一个经测试会有闪烁的情况,再加一个重叠替换运动

<a class="jsbin-embed" href="http://jsbin.com/milopu/1/embed?html,css,js,output">JS Bin</a><script src="http://static.jsbin.com/js/embed.js"></script>


每次改变位置,效率不高。简单封装了一段JS插件

```js
;(function($) {
    'use strict';
    $.extend($.fn, {
        requestAnimFrame: function(opt){
            var defined = {
                top:0,
                left:0,
                position:'absolute'
            },
            option = $.extend(defined, opt),
            i = 0,
            flag = false,
            curAnim = null,
            self = this,
            width = 0,
            isRunning = false,
            maybeAddPx = function (value) {
                return (typeof value == "number") ? value + "px" : value;
            },
            /**
             * 标准化requestAnimFrame
             * @param  {[type]} ){                         return  window.requestAnimationFrame       ||                    window.webkitRequestAnimationFrame ||                    window.mozRequestAnimationFrame    ||                    function( callback ){                    window.setTimeout(callback, 1000 / 60);                    };        })( [description]
             * @return {[type]}     [description]
             */
            requestAnimationFrame = (function(){
                if(option.time) {
                    return  function( callback ){
                            window.setTimeout(option.time);
                        };
                }
                return  window.requestAnimationFrame       ||
                        window.webkitRequestAnimationFrame ||
                        window.mozRequestAnimationFrame    ||
                        function( callback ){
                            window.setTimeout(callback, 1000 / 60);
                        };
            })(),
            //添加两张图,解决一轮动画结束闪屏问题
            anim_1 = $('<div>', {
                css :  {
                     background : 'url(' + option.url + ') no-repeat scroll 0px 0px transparent'
                     
                }

            }),
            anim_2 = anim_1.clone(),
            init = function() {
                self.append(anim_1).append(anim_2).css('position', 'relative');
            },
            width = option.length / option.step,
            go = function() {
                    if (i > step) { i = 0; }
                    flag ? (curAnim = anim_1) : (curAnim = anim_2);

                    flag = !flag;
                    curAnim[0].style.backgroundPosition = "-" + i * width + "px 0px";
                    //使用Zepto方法会闪动,具体看博文:http://www.hacke2.cn/anmi-strange-problem/
                    //curAnim.css('background-position' , '-' + i * 75 + 'px 0px')
                    self.append(curAnim);

                    i++;
                    console.log(isRunning)
                    isRunning && requestAnimationFrame(go)      
            };

            init();

            return {
                run : function() {
                    isRunning = true;

                    requestAnimationFrame(go);

                },
                stop : function() {
                    isRunning = false;
                },
                isRunning : function() {
                    return isRunning;
                }
            };
        }
    })

        
})(Zepto);
```

调用的时候这样调用:

```js
var ra = scope.find('#divParent').requestAnimFrame({
        step : 80,
        url : 'img/1-slow.png',
        length : 6000,
        time : 12
    });
ra.run();
```

自己完成两个DOM的COPY,html结果如下:

```html
<div id="divParent"></div>
```

提供了几个接口:run、stop、isRunning

## 2.CSS3逐帧动画

CSS3方式实现当时比用JS效率高很多,许多优化在浏览器底层完成。之前为什么不用有两点考虑:

1.兼容性

2.每一帧都要手动去写

但是在移动端CSS3已经支持很好了,但每一帧都得自己写太痛苦,还好在一篇博客看到有一个step函数供我们调用 [https://idiotwu.me/css3-running-animation/](https://idiotwu.me/css3-running-animation/)。我们将它整合一下:

<a class="jsbin-embed" href="http://jsbin.com/qejavi/4/embed?html,output">JS Bin</a><script src="http://static.jsbin.com/js/embed.js"></script>

怎么样,是不是很简单,中间的帧数让浏览器给我们计算就可以了。

,关于`step`,这边有篇文章介绍的很详细[CSS3 timing-function: steps() 详解](https://idiotwu.me/understanding-css3-timing-function-steps/)



**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2015-3-4-to-teacher.md
================================================
---
layout: post
title: 给老师的一些课程主题
description: "前端课程的参考主题"
tags: [翻译]
image:
  background: witewall_3.png
comments: true
share: true
---


>我们实验室有一门内部课程,专门讲前端开发,每年的主题都不一样,今年老师让我们建议几个,我罗列了一下几个主题供老师参考:

### 1. 前端工程化

前端工程化是将代码、资源(图片等)的压缩、合并、检错等一些列使用程序来自动完成。有了它可以大大提高开发效率。目前比较流行的国外有grunt,gulp等,国内有fis等,建议讲课时可以讲讲主流前端工程化工具的使用和思考如果将至融入实验室工作的开发流程。

### 2. 前后端分离的思考

以前前端后端开发分离不够,如修改jsp模板前端需要和后端协调,一些数据协议要沟通,一些代码逻辑不能复用(如前后端的数据校验)。支付宝提出使用Node.js在前端和后端中间再加一层,首屏交给Node.js来渲染,二次请求可以通过ajax动态调用。详情可以参照淘宝UED[《前后端分离的思考与实践》](http://ued.taobao.org/blog/2014/04/full-stack-development-with-nodejs/)
一个趋势,大家可以一起学习一下,可以进行头脑风暴。(但实验室这种开发模式是一个人前后端都做,所以没有沟通的成本,但很难在某一领域专一)

<!--more-->

### 3. CSS3动画

现在CSS3新起,动画也有以前的Flash慢慢过渡到用CSS3来实现。使用动画让活动页内容更加丰富活泼,讲的时候建议讲讲重要api及综合案例。参考:

* 黄薇 [《Web高性能动画》](http://melonhuang.github.io/sharing/slides.html?file=high_performance_animation#/)
* [奇舞团《CSS动画使用技巧》](http://www.75team.com/archives/793)
* Webrebuild [《CSS3 动画》](http://daxue.qq.com/content/content/id/1676)

### 4. ECMA Script 6 AND IO.js

ES6将是今年的趋势,这次草案规范了Javascript的类、模块化、Promise、Genertor等重要API,IO.JS作为Node.js的分支,默认开启了ES6,服务端JS是必不可少的

### 5. MVC and MVVM in JavaScript

随着SPA应用的增多,大型前端网页的代码组织不再是简单的JQuery对元素进行操作,而是引入了以Backbone.js代表的MVC框架,以Angular.js代码的MVVM框架。建议实验室同学一起学习学习这些框架的理念。

### 6. Native App VS Web App

本地APP和WEB APP一直孰好孰坏而争吵,可以谈谈两类开发的优劣。另外facebook最新一版使用React.js开发Native App,也以为这JS工程师在无学习成本转向Native App,也可以给大家分享分享React.js

### 7. Web Components

传统的组件开发方式必须要引一堆HTML,CSS,JS,而Web Components提出只是使用简单自定义标签就可以代替传统开发模式,加快了开发的速度,减少了复制时的错误率,这是未来的开发方向,建议做一些DEMO与大家分享。

### 8. Canvas & SVG

随着HTML5新起,Canvas & SVG就尤为重要了,他们可以做游戏、数据可视化等强大的功能。建议讲的时候将一些重要API和DEMO。



**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2015-3-7-share-jsbin.md
================================================
---
layout: post
title: 我在jsbin里存的好东西
description: "在jsbin里存的一些代码片段"
tags: [心声]
image:
  background: witewall_3.png
comments: true
share: true
---

>看到一些有用的代码片段,我就喜欢收藏到我的jsbin里。今天和大家分享一下

1.canvas画出圆环进度条

代码注释很多,初级入门都能看懂,作为活动页很适用

[http://jsbin.com/viribi/1/](http://jsbin.com/viribi/1/edit?html,output)

![](/images/article/jsbin-share/1.png)

2.无刷新分页

推荐用ajax方式,这个代码是讲所有的数据都加载出来的处理方式

[http://jsbin.com/poxawo/1/](http://jsbin.com/poxawo/1/edit?html,output)

![](/images/article/jsbin-share/2.png)

<!--more-->

3.富文本编辑器

火狐开发者网站的,代码不多,使用`document.execCommand`文本样式操作。

[http://jsbin.com/belafa/1/](http://jsbin.com/belafa/1/edit?html,output)

![](/images/article/jsbin-share/3.png)

4.太极

用CSS3画的太极

[http://jsbin.com/jigiko/2/](http://jsbin.com/jigiko/2/edit?html,output)

![](/images/article/jsbin-share/5.png)

5.伸缩式布局

在群众看到一个小伙写1024这个游戏时用的布局,关键是`padding-top:100%`这行代码。在实际用用中,除了上面9格布局,还适用于图片的自适应性。当然也可以使用`padding-bottom`,后面的值为图片的宽高比例

[http://jsbin.com/foruli/3/edit](http://jsbin.com/foruli/3/edit?html,css,output)

![](/images/article/jsbin-share/4.png)

6.动画购物

类天猫的购物、收藏、红心等功能,有动画效果

[http://jsbin.com/ziguke/1/](http://jsbin.com/ziguke/1/edit?html,css,js,output)

![](/images/article/jsbin-share/6.png)

7.条件解析

由于UC某些接口有版本限制,我在写的时候用JSbin边写边调,也共享出来吧

[http://jsbin.com/kajixi/3/edit](http://jsbin.com/kajixi/3/edit)

![](/images/article/jsbin-share/7.png)

8.Promise

几行代码实现的Promise

[http://jsbin.com/batuyo/1/edit?html,js,output](http://jsbin.com/batuyo/1/edit?html,js,output)

9.loading 动画

之前我见过的这个loading动画使用了很多div标签,但是这个缺只使用一个标签,果断收藏了

[http://jsbin.com/yalepo/1/edit?html,css,output](http://jsbin.com/yalepo/1/edit?html,css,output)

![](/images/article/jsbin-share/8.png)


10.canvas笑脸

算是canvas最简单的api使用了

[http://jsbin.com/vaqoba/2/edit](http://jsbin.com/vaqoba/2/edit)

![](/images/article/jsbin-share/9.png)

11.css3瀑布流

群友推荐的,使用CSS3实现瀑布流

[http://jsbin.com/lihamu/1/edit?html,output](http://jsbin.com/lihamu/1/edit?html,output)

![](/images/article/jsbin-share/10.png)

12.妙味首页菜单

以前看妙味首页就感觉特别炫,一位博客园仁兄将至抠出来了,收藏!

[http://jsbin.com/hoyija/1/edit?html,output](http://jsbin.com/hoyija/1/edit?html,output)

![](/images/article/jsbin-share/11.png)


**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2015-5-18-how-i-m-using-es6-modules-in-production.md
================================================
---
layout: post
title: 译-我是怎么在项目中使用ES6模块化的
description: "如何让ES6 module 和 AMD module一起工作"
tags: [ES6]
image:
  background: witewall_3.png
comments: true
share: true
---

>http://jsrocks.org/2015/05/how-i-m-using-es6-modules-in-production/ 原文链接

我使用 [ES6 modules](/categories/modules/)工作已经有一段时间了,今天我就向大家分享下我是怎么使用ES6 moudule的。

<!--more-->

首先,向大家介绍一下Babel ,[Babel](https://babeljs.io/)是用来JS转译的整合工具,它是一个非常活跃的项目,而且它几乎覆盖了所有现代JavaScript特征。(注:JS转译(Javascript Transpiler)请自行谷歌)
Babel完美支持模块化,你可以自己决定你代码的风格,你可以使用AMD,Common,UMD这些规范,而且你甚至能自定义模块规范。

在我的公司里,我们开发了一个基于AMD modules规范的框架(当然尚未开源),用来构建我们的应用。
相信我:对于开发大型的应用,使用AMD规范仍然是一个很好很好的解决方案。我们不能再把所有js代码反正一个文件里,这样是不行的。
悲剧的是我们现在很多些应用的解决方案是类似于[Webpack](http://webpack.github.io/),要想迁移到AMD modules可不是那么容易,而我们公司关于模块化的解决方案是很实用的(尚未开源)。

注:在本文中“解决方案”都是指JS模块化解决方案。
微模块策略
这个策略对我来说很有用。
正如我上文说的那样,我们最终产出模块必须要要是AMD module,但是当某一个AMD模块需要依赖其他模块时,我叫那个模块(AMD模块依赖的模块)叫做微模块。
微模块并不会被应用的每个模块都用到,但是利用它能帮助我们组织代码。
以下代码演示了我们怎么使用微模块:

## 微模块策略

这个策略对我来说很有用。
正如我上文说的那样,我们最终产出模块必须要要是AMD module,但是当某一个AMD模块需要依赖其他模块时,我叫那个模块(AMD模块依赖的模块)叫做微模块。
微模块并不会被应用的每个模块都用到,但是利用它能帮助我们组织代码。
以下代码演示了我们怎么使用微模块:

```js
import config from './config';//导入ES6模块
import { globalpkg } from './config';//动态注入ES6模块参数
import factory from './factory';
 
 zaz.use((pkg) => {      
   "use strict";
    config.dynamic.globalpkg = pkg;
    pkg.require(['modFactory'], (modFactory) => {
        modFactory.create(pkg.utils.deepMerge(config._static, factory));     
    }); 
 });

```

我们在代码的顶部导入了一些模块,并且在我们的AMD模块里还使用了这些导入的模块。在其他的应用中并不会用到这些ES6模块,但是使用了这些微模块后,编译后产生的最终源码有更高的可读性。

这是config模块的代码:

```js
const githubURL = "OUR GITHUB URL HERE";
const staticServer = "http://s1.trrsf.com";
const testsPath = `zaz-${type}-${name}/tests/index.htm?zaz[env]=tests`;
const name = "stalker";
const type = "mod";
const version = "0.0.1";
const state = "ok";
const description = "JavaScript API to deal with user data";
let globalpkg = null; // default export 
const config = {     
  _static: {         
  name,         
  version,         
  state,         
  description,         
  docs: `${githubURL}/pages/terra/zaz-${type}-${name}`,         
  source: `${githubURL}/Terra/zaz-${type}-${name}`,         
  tests: `${staticServer}/fe/${testsPath}`,         
  dependencies: ['mod.wilson']     
  }
}; 
export default config;
```

这是项目的源码结构:

	└── src
	    ├── _js
	        ├── config.js
	        ├── environment.js
          ├── helpers.js
          ├── factory.js
          ├── methods.js
	        └── mod-stalker.js
	        └── mod-stalker.js


我把一些AMD模块的逻辑放进了微小的ES6模块里。
这对于构建处理是很简单的:Babel转译ES6的Javascript代码为ES5的代码;使用导入CommonJS模块的方式来导入微模块。最后用[Browserify](http://browserify.org/) 打包代码。
哈哈!最终生成的代码符合AMD模块规范了。

## 下一步

Sourcemaps比起Browserify来说,Sourcemaps不能很好的处理这个编译的流程。
也许这里能有更好的实现方式。
我们现在可以开始使用ES6新特征和模块化来重构我们的框架了。
你甚至可以自己实现模块加载规范给你的程序,但是我认为这可能不是一个好方法,有可能你会需要完全重写现有的模块加载系统。

## 结论

现在模块规范已经完成了,而且是非常成熟和有效的。
然而,web浏览器至今没有提供js模块加载的原生API,所有像AMD或者CommonJS就显得格外重要了。
现在我们已经体会到ES6模块语法的好处了,可以让我们的代码拥有更高的可读性和简洁性。
现有的工具,比如Babel和Browserify能减少我们开发的痛苦,相信在不久的将来等ES6普及后,我们就能简化js开发流程,这样就能舍弃这些构建打包工具了。


**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2015-9-16-express-node-act.md
================================================
---
layout: post
title: express介绍及实战
description: "神马前端9月新人分享"
tags: [分享]
image:
  background: witewall_3.png
comments: true
share: true
---

>上周5和组内分享了一下express介绍和实战,制作的ppt分享给大家:

[express介绍和实战](http://www.hacke2.cn/ppt/express.html)

**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2016-1-1-review-2015.md
================================================
---
layout: post
title: 2015年终小结
description: "2015回顾"
tags: [Javascript, ES6]
image:
  background: witewall_3.png
comments: true
share: true
---

>随着凌晨12点的钟声,2015就这样过去了,这一年是我从一个学生状态转变为工作状态的一年,对于我来说是人生十分重要的一年。


<!--more-->

[《该是做做计划的时候了!》](http://www.hacke2.cn/2015-plan/)这边文章是今年年初写的,当时大致列了一下几点:

* ES6
* HTML5和CSS3
* backbone,ng等MVC框架
* 属于自己的前端框架
* 算法
* 设计
* 读书
* 毕业设计
* 锻炼
* 独立能力&自理能力

前6个是涉及技术的。

ES6算是零零碎碎学了一些,也在简单的作品里练习了一把。es6在今年改名为es2015,可能也是希望在2015年公司也开始把这个用起来,可惜浏览器支持不够,本来以为并不能现在马上就运用。所幸有大杀器babel,可以将es6代码转化为es5代码,据说编译后的代码甚至优于源代码,今年也是超乎想想的在各个公司线上项目实践起来了。可惜编译后文件过于庞大,目前之适用于pc端,移动端如果对速度有特殊要求的业务并不适用,比如神马搜索主搜业务。但动效平台这种基于Node.js的项目或者其他垂搜感觉可以尝试一下。D2上李成银分享了《使用 ES6/7 特性开发 Node.js 项目》,回来也给部门小伙伴分享了一下,实现了年初的计划。`完成`

HTML5和CSS3在移动端可谓是玩的风生水起,这也是我们部门的一个优势:专注移动端开发。在移动端上不用考虑IE6/7/8等不支持css3特性的浏览器,所以平时写sc时几乎天天和h5,css3打交道,又加上今年神马重点项目是蓝光项目,里面使用了大量的创新交互,加上h5,css3助力,这一块更加稳固了。`完成`

年初的时候大家讨论的最多的就是angular,当时计划也学学backbone, angular等基于mvc的框架,因为自己也有java的功底,所以感觉这些学起来应该不难,但是万万没想到今年是react.js唱戏,衍生出了react-native、relay、flux等基于react.js的生态圈,可谓今年是racet.js的胜利年,各个分享会分享主题多一半也是react.js。最近微博真阿当和各路大侠引发的关于前端框架的争论也颇有看点,总之前端轮子层出不群,最终哪一个能活下来,哪一个才是真正能提高前端的开发效率,还有待观察。但我感觉mvvm确实非常适用于一些业务复杂的场景。神马这边有小康在明星垂直上实践的`vue.js`,也是今年的一个颇具闪光点的mvvm框架。`未完成`

年初本来想的是有一个自己的前端框架,类似于jq等,每一个项目都能用起来,目的是快速构建一个web项目吧,谁知道最后写了一个博客生成器(类似于hex),已经在npm上发布[wooden](https://www.npmjs.com/package/wooden),也算是实现了计划吧。`完成`

算法、设计这两块并无任何建树,感觉应该是火候还未到,或者还没有接触到算法相关的业务吧。。

书倒读了几本Node.js相关的书,但是当时想看一点非技术的书的。。今年很庆幸的是以后的方向定了,想以后就往Node.js方向走走,正好在阿里的大环境下学学Node.js。阿里应该是国内Node.js沉淀最多的公司吧。。`未完成`

非常开心的是毕业设计业顺利过了,之前5月份回学校还有点担心呢。。后来都段时间调设备调到了2点钟。。最后感谢老师的照顾,拿了个校优^_^。`完成`

7月份去公司坚持跑了一段时间的步,当时去公司旁边的学校:北京语言大学和北京地质大学的操场上跑5圈,下雨也是在公司跑步机上坚持,结果没坚持下来。。。`未完成`

十月一号来杭州,二号就把被子什么全买好已经入住了,一个人在杭州生活了100天乐,总体感觉还行,希望在新的一年里,家里收拾更整洁一点,穿的也不求时髦,只求干净。`完成`

2016年将会是正式工作的第一年,希望心中所想能顺顺利利的完成。

最后,跨年夜和大学同学们分享了很多以前的回忆,希望大家能在以后的日子里健康快乐,事业有成。

![11382](http://ww4.sinaimg.cn/large/8ae515a4gw1ezjutg9dixj20zk0k0q6z.jpg)


**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2016-2-1-configuring-babel-6-for-node-js.md
================================================
---
layout: post
title: 译-为你的Node.js配置babel 6
description: "babel 6基础教程"
tags: [Node.js, ES6]
image:
  background: witewall_3.png
comments: true
share: true
---

>原文:http://jsrocks.org/2016/01/configuring-babel-6-for-node-js/

如果你像我一样在你的Node.js应用上还在使用老的ES5 js代码,那么你可以抛弃之前的习惯,现在就可以使用JavaScript ES2015的特性和ES2016的标准在你的Node.js应用上。ES2015和ES2016让JavaScript宛如清风般一样开发,但是,不是每一个ES2015特性在我们心爱的[Node.js](https://nodejs.org)上支持。

这时候[Babel](https://babeljs.io)就派上用场了。<!--more-->Babel是一个让ES2015和ES2016代码转换成ES5甚至是ES3的编译器。简单来说,它会转换你的JavaScript代码,让它在Node.js应用上非常愉悦的用起来。

**小记:** Node.js已经支持多种ES2015的功能,如果你不想转化你的ES2015代码,你可以在启动Node.js是使用 `--harmony` 标签去开启一些已确定标准化的特性。为了使用更多实验性特性可以使用更激进的命令: `node --v8-options | grep harmony` ,但是请注意即便是最新版本的Node.js(在写本文的时候最新版本是5)也不是所有的特性都被支持。这些特性往往是不稳定或不完整的。所以为了保持可读性常常不使用这些特性。

### 下面做一些假设:

- 你了解如何编写[Node.js](https://nodejs.org)应用。
- 你会使用npm来安装软件包。
- 你已经安装了Node.js和npm。
- 你喜欢使用一些命令行命令。
- 最好也了解一点ES2015的语法,当然这个不是必须的。

### 一些例子

有没有一些可运行的例子而不仅仅是阅读代码? 这儿有[可运行的例子](https://github.com/abdulhannanali/babel-configuration-tutorial)

### 安装和开始学习Babel

有很多方法让你可以安装并使用Babel,但这这里我们讨论的是如何让babel-cli运行。

在`code` **文件夹** 下创建一个简单的包含ES2015代码的Index.js文件:

```js
function* jsRocksIsAwesome() {
  yield "JS Rocks is Awesome";
  yield "JS Rocks says JavaScript Rocks";
  return "because JavaScript really rocks";
}

var jsRocks = jsRocksIsAwesome();

console.log(jsRocks.next());
console.log(jsRocks.next());
console.log(jsRocks.next());
```

我们将在下一个命令下安装**babel-cli**。他会在当前项目安装最后一个稳定版本的babel-cli并且也会追加在package.json的devDependencies里。


	npm install --save-dev babel-cli


现在如果你运行


	babel code/index.js -d build/


你将会看见你写的相同代码出现在build/index.js文件夹里,所以Babel的 **插件** 和 **预设** 来临了。

### 插件和预设

babel本身并没有做很多事情,但是通过插件和预设可以实现很多功能。我们希望可以通过babel在我们的代码中使用es2016和es2015所有的优美语法。

为此我们需要安装两个预设文件在 `devDependencies` 里。

- [es2015](https://babeljs.io/docs/plugins/preset-es2015/)
- [stage-0](https://babeljs.io/docs/plugins/preset-stage-0/)

运行下面的命令安装预设文件:


	npm install --save-dev babel-preset-es2015 babel-preset-stage-0

babel拥有广泛的插件在[这边获得](https://babeljs.io/docs/plugins/)

现在你需要在执行命令的时候包含这两个预设。

	babel --presets es2015,stage-0 code/index.js -o build/app.js


现在你会看到正常的ES5代码已经出现在 `app.js`了,它也叫 `编译后的代码` (这是js世界里的一个术语)。你可以使用以下命令运行这些代码:


	node build/app.js

### 使用Babel来配置一个合适的编译环境


这是非常神奇的,但是怎么样才能更好地运用在Node.js开发上?

#### babel的配置文件: .babelrc

`.babelrc` 是一个非常简洁的JSON文件,它可以分离出你的Babel相关的配置。它也是非常易于上手的。以下是本教程的`.babelrc` 文件。

```
{
  "plugins": ["es2015", "stage-0"]
}
```

你可以配置其他[`.babelrc` 选项](http://babeljs.io/docs/usage/options/),确保它和你一样强大。

对于本教程来说这是非常多的配置。现在,每当我们添加或删除插件,我们仅仅改变以下配置选项而不是去修改他的运行命令,是不是很简单!

现在,如果你运行:

	babel -w code/ -d build/

他会从 `.babelrc` 读取 **预设** 去编译在 `code/` 里的代码并且生成编译好的JavaScript文件在 `build/` 文件夹并且不会结束此命令。注意这个 `-w` 标志:如果你对 `code` 文件夹修改,它会 **监听** 和重新编译这个文件夹下的代码,酷!我现在所说的是不是非常神奇。

#### 使用source maps在你的文件

如果你在思考虽然它非常酷和有趣但是非常难于调试编译后的代码。你不用对此担心。Source maps的思想就是出于这个目的。Source maps会告诉Node.js这个错误的 **源文件** 而不是 **编译后的文件** !

这边有一个 `code/error.js` 文件会抛出一个异常在生成器的第二次 `yield`后。编译后的代码完全和源文件是不同的。

```js
function* errorFulGenerator() {
  yield "yo";
  throw new Error("source maps are awesome");
  return "";
}

var errorGen = errorFulGenerator();
errorGen.next();
errorGen.next();
```

我们使用如下命令去给 **编译后的文件** 生成 **source maps**。*注意使用`--source-maps` 标签*:


	babel code/ -d build/ --source-maps


现在当我们遇到错误的时候我们会获得有用的调试信息,如下:


	errorGen.next()
	         ^
	
	Error: source maps are awesome
	    at errorFulGenerator (/home/programreneur/Programming/githubRepos/babeljs-short-tutorial/code/error.js:3:9)
	    at next (native)
	    at Object.<anonymous> (/home/programreneur/Programming/githubRepos/babeljs-short-tutorial/code/error.js:10:10)
	    at Module._compile (module.js:425:26)
	    at Object.Module._extensions..js (module.js:432:10)
	    at Module.load (module.js:356:32)
	    at Function.Module._load (module.js:313:12)
	    at Function.Module.runMain (module.js:457:10)
	    at startup (node.js:138:18)
	    at node.js:974:3


这个就是使用 source maps 的方法。

#### 设置npm命令

为了能每一次都非常简单的使用编译命令,你可以更新你的 `package.json` 文件去为Babel加一个构建命令。在 `package.json` 的 `script` 对象你可以如下添加构建命令。


```js
"scripts": {
  "build": "babel -w code/ -d build -s"
}
```

现在,我们运行:


	npm run build


从今天开始就应该全面享受 ES2015/ES2016 带来的好处了!

#### 了解更多关于Babel的知识

这是一个Babel基础教程,但是Babel的世界才刚刚开始。它有给力的社区作支撑并且已经在IT世界有了响当当的名声。Babel也支持大多数构建工具例如[Grunt](https://www.npmjs.com/package/grunt-babel) 和 [gulp](https://npmjs.org/package/gulp-babel/). 你可以在 [Babel Website](https://babeljs.io/docs/setup/)了解到相关信息。

这儿有一些资源可以帮助你在Bable的世界里打怪升级:

- [Learn ES2015 and Babel using this detailed tutorial](http://ccoenraets.github.io/es6-tutorial/index.html)
- [Read the Babel docs on setting up Babel (They're helpful)](https://babeljs.io/docs/setup/)

#### 源码、贡献和感谢

本教程的源码在[这个仓库](https://github.com/abdulhannanali/babel-configuration-tutorial)。

如果你发现一下错别字或者有一些更新,请使用issues或者给[我们的Github 仓库](https://github.com/abdulhannanali/babel-configuration-tutorial)发起PR。

我也非常感谢[Fabrício Matté](http://ultcombo.js.org/) 审阅这篇文章并且把它发布在[JS Rocks](https://github.com/JSRocksHQ/jsrockshq.github.io/) 并且也做了一些更正。

**文章来自 [{{ site.url }}]({{ site.url }})**

================================================
FILE: _posts/2016-6-19-think-in-react-redux-1.md
================================================
---
layout: post
title: React + Redux 入门(一):抛开 React 学 Redux
description: "redux 入门"
tags: [Redux, React]
image:
  background: witewall_3.png
comments: true
share: true
---

## redux简介

Redux 是一个改变状态(state)的模型,这个模型通过一个单向操作的方式来改变状态。现在网上教程一言不合上来就是 Redux + React 的综合运用,经常搞的人一脸懵逼。其实 Redux 和 React 完全解耦,并不是 Redux 非得和 React结合才能使用,而只是 React 结合 Redux 会事半功倍。本系列主要也讲得这个。

对于日益复杂的 Javascript 应用来说,Javascript 需要管理非常多的 state。包括本地尚未持久化到数据库的数据、UI状态等等,而且这些状态有可能是相互关联的,一个状态的改变可能会引起另外一个状态的变化,如果用命令式编程将会变得异常复杂以及难以维护。Redux 作为一个专门关联 state 的框架应用而生,而这种单向数据流的思想也让 Redux 成为一个现代框架。

<!--more-->

![](http://img4.tbcdn.cn/L1/461/1/3db24afe31e7218b4ac6cc74497204250b2f5f3a)

redux介绍

### redux三大原则

Redux 有三大原则:

- 单一数据源
- state 只读
- 只用纯函数来修改

### 单一数据源

整个应用的 state 都是保存在一个对象树中,而且这个对象树存在唯一一个 store。这个 store 我们通过`redux.createStore创建`,通过以下代码获取:

```js
store.getState()
```	

### state 只读

改变 state 只能通过 dispatch 一个 action 才能修改。

action 其实就是一个简单对象,其中type是必填项,以便 区分是哪一个 action。

```js
store.dispatch({
  type: 'ALL'
});
```

为了方便给 action 传递数据,一般来说我们
Download .txt
gitextract_t3zun56q/

├── .about.md.swp
├── .gitignore
├── .jshintrc
├── .project
├── 404.md
├── CNAME
├── Gemfile
├── Gruntfile.js
├── LICENSE
├── README.md
├── Rakefile.rb
├── _config.yml
├── _includes/
│   ├── browser-upgrade.html
│   ├── disqus_comments.html
│   ├── footer.html
│   ├── head.html
│   ├── navigation.html
│   └── scripts.html
├── _layouts/
│   ├── page.html
│   ├── post-index.html
│   └── post.html
├── _posts/
│   ├── 2014-10-1-for-me-1.html
│   ├── 2014-10-1-mongoose-populate.md
│   ├── 2014-10-11-the-golden-key.md
│   ├── 2014-10-14-links-share-2014-10-14.md
│   ├── 2014-10-2-great-nodejs.md
│   ├── 2014-10-20-tink-in-Ghostjs.md
│   ├── 2014-10-22-html5-javascript-web-dep.md
│   ├── 2014-10-29-2014-10-d2.md
│   ├── 2014-10-3-node-westom-mina.md
│   ├── 2014-10-31-es6-modules-today-with-6to5.md
│   ├── 2014-11-10-javascript-aop.md
│   ├── 2014-11-11-hello-mobile-aop.md
│   ├── 2014-11-12-create-github-page.md
│   ├── 2014-11-14-answer-how-to-prepare.md
│   ├── 2014-11-18-about-responsive.md
│   ├── 2014-11-30-gugong.md
│   ├── 2014-11-8-arrow-functions-and-their-scope.md
│   ├── 2014-12-2-fe-cut-image.md
│   ├── 2014-12-8-my-university-experience.md
│   ├── 2014-8-29-hello-memory-leak.md
│   ├── 2014-8-29-web-development-process.md
│   ├── 2014-8-31-javascript-quiz.md
│   ├── 2014-9-1-cqut-paging.md
│   ├── 2014-9-1-oschina-angularjs.md
│   ├── 2014-9-10-level-img-change.md
│   ├── 2014-9-11-nodeJS-char.md
│   ├── 2014-9-12-css3-lenove.md
│   ├── 2014-9-18-no-sleep.md
│   ├── 2014-9-2-what-happens-when-you-type-in-a-url-in-browser.md
│   ├── 2014-9-26-div-center.md
│   ├── 2014-9-26-think-in-seo.md
│   ├── 2014-9-28-gokk.md
│   ├── 2014-9-30-nodeJS-sublime-3.md
│   ├── 2014-9-4-javascript-seamless-handover.md
│   ├── 2014-9-4-my-show-4-angularjs.md
│   ├── 2015-1-13-what-you-need-to-know-about-block-scope-let.md
│   ├── 2015-1-14-2015-plan.md
│   ├── 2015-10-21-scroll-in-uc.md
│   ├── 2015-10-9-javascript-iterables-and-iterators.md
│   ├── 2015-11-17-use-node-build-static-blog.md
│   ├── 2015-2-25-Variables-and-scoping-in-ECMAScript-6.md
│   ├── 2015-3-13-anmi-strange-problem.md
│   ├── 2015-3-20-css-multi-row-overflow.md
│   ├── 2015-3-23-frame-animation.md
│   ├── 2015-3-4-to-teacher.md
│   ├── 2015-3-7-share-jsbin.md
│   ├── 2015-5-18-how-i-m-using-es6-modules-in-production.md
│   ├── 2015-9-16-express-node-act.md
│   ├── 2016-1-1-review-2015.md
│   ├── 2016-2-1-configuring-babel-6-for-node-js.md
│   ├── 2016-6-19-think-in-react-redux-1.md
│   └── 2017-01-22-review-2016.md
├── about.md
├── assets/
│   ├── assets/
│   │   └── js/
│   │       └── plugins/
│   │           ├── jquery.dlmenu.js
│   │           ├── jquery.fitvids.js
│   │           └── jquery.magnific-popup.js
│   ├── css/
│   │   └── main.css
│   ├── fonts/
│   │   └── FontAwesome.otf
│   ├── js/
│   │   ├── _main.js
│   │   └── plugins/
│   │       ├── jquery.dlmenu.js
│   │       ├── jquery.fitvids.js
│   │       ├── jquery.magnific-popup.js
│   │       └── respond.js
│   └── less/
│       ├── coderay.less
│       ├── dl-menu.less
│       ├── elements.less
│       ├── font-awesome/
│       │   ├── bordered-pulled.less
│       │   ├── core.less
│       │   ├── fixed-width.less
│       │   ├── font-awesome.less
│       │   ├── icons.less
│       │   ├── larger.less
│       │   ├── list.less
│       │   ├── mixins.less
│       │   ├── path.less
│       │   ├── rotated-flipped.less
│       │   ├── spinning.less
│       │   ├── stacked.less
│       │   └── variables.less
│       ├── font-awesome.less
│       ├── gist.less
│       ├── grid.less
│       ├── magnific-popup.less
│       ├── main.less
│       ├── mixins.less
│       ├── page.less
│       ├── pygments.less
│       ├── reset.less
│       ├── site.less
│       ├── typography.less
│       └── variables.less
├── common/
│   └── js/
│       ├── ajax.js
│       ├── startmove.js
│       └── test.js
├── demo/
│   ├── 2014-11/
│   │   ├── ali-media.html
│   │   ├── ali-percent.html
│   │   ├── ali-px.html
│   │   └── ali-rem.html
│   ├── absolute_percent.html
│   ├── cqut-paging/
│   │   └── demo.html
│   ├── css3/
│   │   └── imocoo_2.html
│   ├── javascript-seamless-handover/
│   │   ├── css/
│   │   │   ├── main.css
│   │   │   └── reset.css
│   │   ├── index.html
│   │   └── slide/
│   │       ├── bd01.html
│   │       ├── css/
│   │       │   └── slide.css
│   │       └── js/
│   │           └── startmove.js
│   ├── js-template/
│   │   └── demo.html
│   ├── mobile/
│   │   └── position/
│   │       ├── absolute.html
│   │       ├── flex.html
│   │       └── reset.css
│   └── my-show-4-angularjs/
│       ├── index.html
│       ├── index.js
│       ├── js/
│       │   ├── angular-1.3.0.js
│       │   ├── angular-animate.js
│       │   ├── angular-route.js
│       │   ├── angular-ui-router.js
│       │   └── ui-bootstrap-tpls-0.11.0.js
│       └── pages/
│           ├── about.html
│           ├── contact.html
│           ├── home.html
│           └── project.html
├── feed.xml
├── index.html
├── monthly/
│   └── index.html
├── package.json
├── posts.html
├── ppt/
│   ├── css/
│   │   ├── font-awesome.css
│   │   ├── nodeppt.css
│   │   ├── pdf.css
│   │   ├── pen.cur
│   │   ├── phone.css
│   │   ├── theme.blue.css
│   │   ├── theme.dark.css
│   │   ├── theme.green.css
│   │   ├── theme.light.css
│   │   └── theme.moon.css
│   ├── express.html
│   ├── fonts/
│   │   ├── .font-spider/
│   │   │   └── fontawesome-webfont
│   │   └── FontAwesome.otf
│   ├── js/
│   │   ├── event/
│   │   │   └── broadcast.js
│   │   ├── highlight/
│   │   │   ├── default.css
│   │   │   ├── highlight.pack.js
│   │   │   ├── hljs-0.8.js
│   │   │   ├── languages/
│   │   │   │   ├── 1c.js
│   │   │   │   ├── actionscript.js
│   │   │   │   ├── apache.js
│   │   │   │   ├── applescript.js
│   │   │   │   ├── asciidoc.js
│   │   │   │   ├── autohotkey.js
│   │   │   │   ├── avrasm.js
│   │   │   │   ├── axapta.js
│   │   │   │   ├── bash.js
│   │   │   │   ├── brainfuck.js
│   │   │   │   ├── capnproto.js
│   │   │   │   ├── clojure.js
│   │   │   │   ├── cmake.js
│   │   │   │   ├── coffeescript.js
│   │   │   │   ├── cpp.js
│   │   │   │   ├── cs.js
│   │   │   │   ├── css.js
│   │   │   │   ├── d.js
│   │   │   │   ├── delphi.js
│   │   │   │   ├── diff.js
│   │   │   │   ├── django.js
│   │   │   │   ├── dos.js
│   │   │   │   ├── elixir.js
│   │   │   │   ├── erlang-repl.js
│   │   │   │   ├── erlang.js
│   │   │   │   ├── fix.js
│   │   │   │   ├── fsharp.js
│   │   │   │   ├── gherkin.js
│   │   │   │   ├── glsl.js
│   │   │   │   ├── go.js
│   │   │   │   ├── gradle.js
│   │   │   │   ├── haml.js
│   │   │   │   ├── handlebars.js
│   │   │   │   ├── haskell.js
│   │   │   │   ├── haxe.js
│   │   │   │   ├── http.js
│   │   │   │   ├── ini.js
│   │   │   │   ├── java.js
│   │   │   │   ├── javascript.js
│   │   │   │   ├── json.js
│   │   │   │   ├── lasso.js
│   │   │   │   ├── lisp.js
│   │   │   │   ├── livecodeserver.js
│   │   │   │   ├── lua.js
│   │   │   │   ├── makefile.js
│   │   │   │   ├── markdown.js
│   │   │   │   ├── mathematica.js
│   │   │   │   ├── matlab.js
│   │   │   │   ├── mel.js
│   │   │   │   ├── mizar.js
│   │   │   │   ├── monkey.js
│   │   │   │   ├── nginx.js
│   │   │   │   ├── nimrod.js
│   │   │   │   ├── nix.js
│   │   │   │   ├── nsis.js
│   │   │   │   ├── objectivec.js
│   │   │   │   ├── ocaml.js
│   │   │   │   ├── oxygene.js
│   │   │   │   ├── parser3.js
│   │   │   │   ├── perl.js
│   │   │   │   ├── php.js
│   │   │   │   ├── profile.js
│   │   │   │   ├── protobuf.js
│   │   │   │   ├── python.js
│   │   │   │   ├── r.js
│   │   │   │   ├── rib.js
│   │   │   │   ├── rsl.js
│   │   │   │   ├── ruby.js
│   │   │   │   ├── ruleslanguage.js
│   │   │   │   ├── rust.js
│   │   │   │   ├── scala.js
│   │   │   │   ├── scilab.js
│   │   │   │   ├── scss.js
│   │   │   │   ├── smalltalk.js
│   │   │   │   ├── sql.js
│   │   │   │   ├── swift.js
│   │   │   │   ├── tex.js
│   │   │   │   ├── thrift.js
│   │   │   │   ├── typescript.js
│   │   │   │   ├── vala.js
│   │   │   │   ├── vbnet.js
│   │   │   │   ├── vbscript.js
│   │   │   │   ├── vhdl.js
│   │   │   │   ├── vim.js
│   │   │   │   ├── x86asm.js
│   │   │   │   └── xml.js
│   │   │   └── styles/
│   │   │       ├── arta.css
│   │   │       ├── ascetic.css
│   │   │       ├── atelier-dune.dark.css
│   │   │       ├── atelier-dune.light.css
│   │   │       ├── atelier-forest.dark.css
│   │   │       ├── atelier-forest.light.css
│   │   │       ├── atelier-heath.dark.css
│   │   │       ├── atelier-heath.light.css
│   │   │       ├── atelier-lakeside.dark.css
│   │   │       ├── atelier-lakeside.light.css
│   │   │       ├── atelier-seaside.dark.css
│   │   │       ├── atelier-seaside.light.css
│   │   │       ├── brown_paper.css
│   │   │       ├── codepen-embed.css
│   │   │       ├── color-brewer.css
│   │   │       ├── dark.css
│   │   │       ├── default.css
│   │   │       ├── docco.css
│   │   │       ├── far.css
│   │   │       ├── foundation.css
│   │   │       ├── github.css
│   │   │       ├── googlecode.css
│   │   │       ├── hybrid.css
│   │   │       ├── idea.css
│   │   │       ├── ir_black.css
│   │   │       ├── kimbie.dark.css
│   │   │       ├── kimbie.light.css
│   │   │       ├── magula.css
│   │   │       ├── mono-blue.css
│   │   │       ├── monokai.css
│   │   │       ├── monokai_sublime.css
│   │   │       ├── obsidian.css
│   │   │       ├── paraiso.dark.css
│   │   │       ├── paraiso.light.css
│   │   │       ├── pojoaque.css
│   │   │       ├── railscasts.css
│   │   │       ├── rainbow.css
│   │   │       ├── school_book.css
│   │   │       ├── solarized_dark.css
│   │   │       ├── solarized_light.css
│   │   │       ├── sunburst.css
│   │   │       ├── tomorrow-night-blue.css
│   │   │       ├── tomorrow-night-bright.css
│   │   │       ├── tomorrow-night-eighties.css
│   │   │       ├── tomorrow-night.css
│   │   │       ├── tomorrow.css
│   │   │       ├── vs.css
│   │   │       ├── xcode.css
│   │   │       └── zenburn.css
│   │   ├── img.screenfull.js
│   │   ├── mixjs/
│   │   │   ├── .npmignore
│   │   │   ├── Gruntfile.js
│   │   │   ├── MIT-LICENSE.txt
│   │   │   ├── README.md
│   │   │   ├── lib/
│   │   │   │   ├── event/
│   │   │   │   │   ├── broadcast.js
│   │   │   │   │   └── wait.js
│   │   │   │   ├── mix-0.2.js
│   │   │   │   └── mix.0.3.0.js
│   │   │   ├── package.json
│   │   │   ├── research/
│   │   │   │   ├── js.php
│   │   │   │   ├── load-test.html
│   │   │   │   ├── loadjs.html
│   │   │   │   └── userAgent.html
│   │   │   └── src/
│   │   │       ├── Module.js
│   │   │       ├── Promise.js
│   │   │       ├── browser.js
│   │   │       ├── core.js
│   │   │       ├── getCurrentScript.js
│   │   │       ├── getPath.js
│   │   │       ├── intro.js
│   │   │       ├── loadcss-img.js
│   │   │       ├── loadcss.js
│   │   │       ├── loadjs.js
│   │   │       ├── outro.js
│   │   │       ├── typeof.js
│   │   │       └── vars.js
│   │   ├── nodeppt.control.js
│   │   ├── nodeppt.control.postMessage.js
│   │   ├── nodeppt.control.socket.js
│   │   ├── nodeppt.js
│   │   ├── prettify.js
│   │   ├── qrcode.js
│   │   ├── shake.js
│   │   ├── socket.io.js
│   │   └── zoom.js
│   ├── node-generator-koa/
│   │   ├── css/
│   │   │   ├── animation.css
│   │   │   ├── font-awesome.css
│   │   │   ├── nodeppt.css
│   │   │   ├── nodeppt2.0.css
│   │   │   ├── pdf.css
│   │   │   ├── pen.cur
│   │   │   ├── phone.css
│   │   │   ├── theme.blue.css
│   │   │   ├── theme.dark.css
│   │   │   ├── theme.green.css
│   │   │   ├── theme.light.css
│   │   │   └── theme.moon.css
│   │   ├── fonts/
│   │   │   └── FontAwesome.otf
│   │   ├── index.html
│   │   └── js/
│   │       ├── event/
│   │       │   └── broadcast.js
│   │       ├── highlight/
│   │       │   ├── default.css
│   │       │   ├── highlight.pack.js
│   │       │   ├── hljs-0.8.js
│   │       │   ├── languages/
│   │       │   │   ├── 1c.js
│   │       │   │   ├── actionscript.js
│   │       │   │   ├── apache.js
│   │       │   │   ├── applescript.js
│   │       │   │   ├── asciidoc.js
│   │       │   │   ├── autohotkey.js
│   │       │   │   ├── avrasm.js
│   │       │   │   ├── axapta.js
│   │       │   │   ├── bash.js
│   │       │   │   ├── brainfuck.js
│   │       │   │   ├── capnproto.js
│   │       │   │   ├── clojure.js
│   │       │   │   ├── cmake.js
│   │       │   │   ├── coffeescript.js
│   │       │   │   ├── cpp.js
│   │       │   │   ├── cs.js
│   │       │   │   ├── css.js
│   │       │   │   ├── d.js
│   │       │   │   ├── delphi.js
│   │       │   │   ├── diff.js
│   │       │   │   ├── django.js
│   │       │   │   ├── dos.js
│   │       │   │   ├── elixir.js
│   │       │   │   ├── erlang-repl.js
│   │       │   │   ├── erlang.js
│   │       │   │   ├── fix.js
│   │       │   │   ├── fsharp.js
│   │       │   │   ├── gherkin.js
│   │       │   │   ├── glsl.js
│   │       │   │   ├── go.js
│   │       │   │   ├── gradle.js
│   │       │   │   ├── haml.js
│   │       │   │   ├── handlebars.js
│   │       │   │   ├── haskell.js
│   │       │   │   ├── haxe.js
│   │       │   │   ├── http.js
│   │       │   │   ├── ini.js
│   │       │   │   ├── java.js
│   │       │   │   ├── javascript.js
│   │       │   │   ├── json.js
│   │       │   │   ├── lasso.js
│   │       │   │   ├── lisp.js
│   │       │   │   ├── livecodeserver.js
│   │       │   │   ├── lua.js
│   │       │   │   ├── makefile.js
│   │       │   │   ├── markdown.js
│   │       │   │   ├── mathematica.js
│   │       │   │   ├── matlab.js
│   │       │   │   ├── mel.js
│   │       │   │   ├── mizar.js
│   │       │   │   ├── monkey.js
│   │       │   │   ├── nginx.js
│   │       │   │   ├── nimrod.js
│   │       │   │   ├── nix.js
│   │       │   │   ├── nsis.js
│   │       │   │   ├── objectivec.js
│   │       │   │   ├── ocaml.js
│   │       │   │   ├── oxygene.js
│   │       │   │   ├── parser3.js
│   │       │   │   ├── perl.js
│   │       │   │   ├── php.js
│   │       │   │   ├── profile.js
│   │       │   │   ├── protobuf.js
│   │       │   │   ├── python.js
│   │       │   │   ├── r.js
│   │       │   │   ├── rib.js
│   │       │   │   ├── rsl.js
│   │       │   │   ├── ruby.js
│   │       │   │   ├── ruleslanguage.js
│   │       │   │   ├── rust.js
│   │       │   │   ├── scala.js
│   │       │   │   ├── scilab.js
│   │       │   │   ├── scss.js
│   │       │   │   ├── smalltalk.js
│   │       │   │   ├── sql.js
│   │       │   │   ├── swift.js
│   │       │   │   ├── tex.js
│   │       │   │   ├── thrift.js
│   │       │   │   ├── typescript.js
│   │       │   │   ├── vala.js
│   │       │   │   ├── vbnet.js
│   │       │   │   ├── vbscript.js
│   │       │   │   ├── vhdl.js
│   │       │   │   ├── vim.js
│   │       │   │   ├── x86asm.js
│   │       │   │   └── xml.js
│   │       │   └── styles/
│   │       │       ├── arta.css
│   │       │       ├── ascetic.css
│   │       │       ├── atelier-dune.dark.css
│   │       │       ├── atelier-dune.light.css
│   │       │       ├── atelier-forest.dark.css
│   │       │       ├── atelier-forest.light.css
│   │       │       ├── atelier-heath.dark.css
│   │       │       ├── atelier-heath.light.css
│   │       │       ├── atelier-lakeside.dark.css
│   │       │       ├── atelier-lakeside.light.css
│   │       │       ├── atelier-seaside.dark.css
│   │       │       ├── atelier-seaside.light.css
│   │       │       ├── brown_paper.css
│   │       │       ├── codepen-embed.css
│   │       │       ├── color-brewer.css
│   │       │       ├── dark.css
│   │       │       ├── default.css
│   │       │       ├── docco.css
│   │       │       ├── far.css
│   │       │       ├── foundation.css
│   │       │       ├── github.css
│   │       │       ├── googlecode.css
│   │       │       ├── hybrid.css
│   │       │       ├── idea.css
│   │       │       ├── ir_black.css
│   │       │       ├── kimbie.dark.css
│   │       │       ├── kimbie.light.css
│   │       │       ├── magula.css
│   │       │       ├── mono-blue.css
│   │       │       ├── monokai.css
│   │       │       ├── monokai_sublime.css
│   │       │       ├── obsidian.css
│   │       │       ├── paraiso.dark.css
│   │       │       ├── paraiso.light.css
│   │       │       ├── pojoaque.css
│   │       │       ├── railscasts.css
│   │       │       ├── rainbow.css
│   │       │       ├── school_book.css
│   │       │       ├── solarized_dark.css
│   │       │       ├── solarized_light.css
│   │       │       ├── sunburst.css
│   │       │       ├── tomorrow-night-blue.css
│   │       │       ├── tomorrow-night-bright.css
│   │       │       ├── tomorrow-night-eighties.css
│   │       │       ├── tomorrow-night.css
│   │       │       ├── tomorrow.css
│   │       │       ├── vs.css
│   │       │       ├── xcode.css
│   │       │       └── zenburn.css
│   │       ├── img.screenfull.js
│   │       ├── mixjs/
│   │       │   ├── .npmignore
│   │       │   ├── Gruntfile.js
│   │       │   ├── MIT-LICENSE.txt
│   │       │   ├── README.md
│   │       │   ├── lib/
│   │       │   │   ├── event/
│   │       │   │   │   ├── broadcast.js
│   │       │   │   │   └── wait.js
│   │       │   │   ├── mix-0.2.js
│   │       │   │   └── mix.0.3.0.js
│   │       │   ├── package.json
│   │       │   ├── research/
│   │       │   │   ├── js.php
│   │       │   │   ├── load-test.html
│   │       │   │   ├── loadjs.html
│   │       │   │   └── userAgent.html
│   │       │   └── src/
│   │       │       ├── Module.js
│   │       │       ├── Promise.js
│   │       │       ├── browser.js
│   │       │       ├── core.js
│   │       │       ├── getCurrentScript.js
│   │       │       ├── getPath.js
│   │       │       ├── intro.js
│   │       │       ├── loadcss-img.js
│   │       │       ├── loadcss.js
│   │       │       ├── loadjs.js
│   │       │       ├── outro.js
│   │       │       ├── typeof.js
│   │       │       └── vars.js
│   │       ├── nodeppt.control.js
│   │       ├── nodeppt.control.postMessage.js
│   │       ├── nodeppt.control.socket.js
│   │       ├── nodeppt.js
│   │       ├── prettify.js
│   │       ├── qrcode.js
│   │       ├── shake.js
│   │       └── socket.io.js
│   └── think-in-css/
│       ├── css/
│       │   ├── font-awesome.css
│       │   ├── nodeppt.css
│       │   ├── pdf.css
│       │   ├── pen.cur
│       │   ├── phone.css
│       │   ├── theme.blue.css
│       │   ├── theme.dark.css
│       │   ├── theme.green.css
│       │   ├── theme.light.css
│       │   └── theme.moon.css
│       ├── fonts/
│       │   ├── .font-spider/
│       │   │   └── fontawesome-webfont
│       │   └── FontAwesome.otf
│       ├── index.html
│       ├── js/
│       │   ├── event/
│       │   │   └── broadcast.js
│       │   ├── highlight/
│       │   │   ├── default.css
│       │   │   ├── highlight.pack.js
│       │   │   ├── hljs-0.8.js
│       │   │   ├── languages/
│       │   │   │   ├── 1c.js
│       │   │   │   ├── actionscript.js
│       │   │   │   ├── apache.js
│       │   │   │   ├── applescript.js
│       │   │   │   ├── asciidoc.js
│       │   │   │   ├── autohotkey.js
│       │   │   │   ├── avrasm.js
│       │   │   │   ├── axapta.js
│       │   │   │   ├── bash.js
│       │   │   │   ├── brainfuck.js
│       │   │   │   ├── capnproto.js
│       │   │   │   ├── clojure.js
│       │   │   │   ├── cmake.js
│       │   │   │   ├── coffeescript.js
│       │   │   │   ├── cpp.js
│       │   │   │   ├── cs.js
│       │   │   │   ├── css.js
│       │   │   │   ├── d.js
│       │   │   │   ├── delphi.js
│       │   │   │   ├── diff.js
│       │   │   │   ├── django.js
│       │   │   │   ├── dos.js
│       │   │   │   ├── elixir.js
│       │   │   │   ├── erlang-repl.js
│       │   │   │   ├── erlang.js
│       │   │   │   ├── fix.js
│       │   │   │   ├── fsharp.js
│       │   │   │   ├── gherkin.js
│       │   │   │   ├── glsl.js
│       │   │   │   ├── go.js
│       │   │   │   ├── gradle.js
│       │   │   │   ├── haml.js
│       │   │   │   ├── handlebars.js
│       │   │   │   ├── haskell.js
│       │   │   │   ├── haxe.js
│       │   │   │   ├── http.js
│       │   │   │   ├── ini.js
│       │   │   │   ├── java.js
│       │   │   │   ├── javascript.js
│       │   │   │   ├── json.js
│       │   │   │   ├── lasso.js
│       │   │   │   ├── lisp.js
│       │   │   │   ├── livecodeserver.js
│       │   │   │   ├── lua.js
│       │   │   │   ├── makefile.js
│       │   │   │   ├── markdown.js
│       │   │   │   ├── mathematica.js
│       │   │   │   ├── matlab.js
│       │   │   │   ├── mel.js
│       │   │   │   ├── mizar.js
│       │   │   │   ├── monkey.js
│       │   │   │   ├── nginx.js
│       │   │   │   ├── nimrod.js
│       │   │   │   ├── nix.js
│       │   │   │   ├── nsis.js
│       │   │   │   ├── objectivec.js
│       │   │   │   ├── ocaml.js
│       │   │   │   ├── oxygene.js
│       │   │   │   ├── parser3.js
│       │   │   │   ├── perl.js
│       │   │   │   ├── php.js
│       │   │   │   ├── profile.js
│       │   │   │   ├── protobuf.js
│       │   │   │   ├── python.js
│       │   │   │   ├── r.js
│       │   │   │   ├── rib.js
│       │   │   │   ├── rsl.js
│       │   │   │   ├── ruby.js
│       │   │   │   ├── ruleslanguage.js
│       │   │   │   ├── rust.js
│       │   │   │   ├── scala.js
│       │   │   │   ├── scilab.js
│       │   │   │   ├── scss.js
│       │   │   │   ├── smalltalk.js
│       │   │   │   ├── sql.js
│       │   │   │   ├── swift.js
│       │   │   │   ├── tex.js
│       │   │   │   ├── thrift.js
│       │   │   │   ├── typescript.js
│       │   │   │   ├── vala.js
│       │   │   │   ├── vbnet.js
│       │   │   │   ├── vbscript.js
│       │   │   │   ├── vhdl.js
│       │   │   │   ├── vim.js
│       │   │   │   ├── x86asm.js
│       │   │   │   └── xml.js
│       │   │   └── styles/
│       │   │       ├── arta.css
│       │   │       ├── ascetic.css
│       │   │       ├── atelier-dune.dark.css
│       │   │       ├── atelier-dune.light.css
│       │   │       ├── atelier-forest.dark.css
│       │   │       ├── atelier-forest.light.css
│       │   │       ├── atelier-heath.dark.css
│       │   │       ├── atelier-heath.light.css
│       │   │       ├── atelier-lakeside.dark.css
│       │   │       ├── atelier-lakeside.light.css
│       │   │       ├── atelier-seaside.dark.css
│       │   │       ├── atelier-seaside.light.css
│       │   │       ├── brown_paper.css
│       │   │       ├── codepen-embed.css
│       │   │       ├── color-brewer.css
│       │   │       ├── dark.css
│       │   │       ├── default.css
│       │   │       ├── docco.css
│       │   │       ├── far.css
│       │   │       ├── foundation.css
│       │   │       ├── github.css
│       │   │       ├── googlecode.css
│       │   │       ├── hybrid.css
│       │   │       ├── idea.css
│       │   │       ├── ir_black.css
│       │   │       ├── kimbie.dark.css
│       │   │       ├── kimbie.light.css
│       │   │       ├── magula.css
│       │   │       ├── mono-blue.css
│       │   │       ├── monokai.css
│       │   │       ├── monokai_sublime.css
│       │   │       ├── obsidian.css
│       │   │       ├── paraiso.dark.css
│       │   │       ├── paraiso.light.css
│       │   │       ├── pojoaque.css
│       │   │       ├── railscasts.css
│       │   │       ├── rainbow.css
│       │   │       ├── school_book.css
│       │   │       ├── solarized_dark.css
│       │   │       ├── solarized_light.css
│       │   │       ├── sunburst.css
│       │   │       ├── tomorrow-night-blue.css
│       │   │       ├── tomorrow-night-bright.css
│       │   │       ├── tomorrow-night-eighties.css
│       │   │       ├── tomorrow-night.css
│       │   │       ├── tomorrow.css
│       │   │       ├── vs.css
│       │   │       ├── xcode.css
│       │   │       └── zenburn.css
│       │   ├── img.screenfull.js
│       │   ├── mixjs/
│       │   │   ├── .npmignore
│       │   │   ├── Gruntfile.js
│       │   │   ├── MIT-LICENSE.txt
│       │   │   ├── README.md
│       │   │   ├── lib/
│       │   │   │   ├── event/
│       │   │   │   │   ├── broadcast.js
│       │   │   │   │   └── wait.js
│       │   │   │   ├── mix-0.2.js
│       │   │   │   └── mix.0.3.0.js
│       │   │   ├── package.json
│       │   │   ├── research/
│       │   │   │   ├── js.php
│       │   │   │   ├── load-test.html
│       │   │   │   ├── loadjs.html
│       │   │   │   └── userAgent.html
│       │   │   └── src/
│       │   │       ├── Module.js
│       │   │       ├── Promise.js
│       │   │       ├── browser.js
│       │   │       ├── core.js
│       │   │       ├── getCurrentScript.js
│       │   │       ├── getPath.js
│       │   │       ├── intro.js
│       │   │       ├── loadcss-img.js
│       │   │       ├── loadcss.js
│       │   │       ├── loadjs.js
│       │   │       ├── outro.js
│       │   │       ├── typeof.js
│       │   │       └── vars.js
│       │   ├── nodeppt.control.js
│       │   ├── nodeppt.control.postMessage.js
│       │   ├── nodeppt.control.socket.js
│       │   ├── nodeppt.js
│       │   ├── prettify.js
│       │   ├── qrcode.js
│       │   ├── shake.js
│       │   ├── socket.io.js
│       │   └── zoom.js
│       ├── sm.htm
│       └── think-in-css.html
├── project-school/
│   ├── .project
│   ├── html/
│   │   ├── resume.html
│   │   ├── template.html
│   │   └── test.txt
│   ├── index.gtml
│   ├── index.html
│   ├── js/
│   │   ├── angular.js
│   │   ├── controllers.js
│   │   ├── index.js
│   │   └── tool.js
│   └── themes/
│       ├── default/
│       │   ├── accordion.css
│       │   ├── calendar.css
│       │   ├── combo.css
│       │   ├── combobox.css
│       │   ├── datagrid.css
│       │   ├── datebox.css
│       │   ├── dialog.css
│       │   ├── easyui.css
│       │   ├── layout.css
│       │   ├── linkbutton.css
│       │   ├── menu.css
│       │   ├── menubutton.css
│       │   ├── messager.css
│       │   ├── pagination.css
│       │   ├── panel.css
│       │   ├── progressbar.css
│       │   ├── propertygrid.css
│       │   ├── searchbox.css
│       │   ├── slider.css
│       │   ├── spinner.css
│       │   ├── splitbutton.css
│       │   ├── tabs.css
│       │   ├── tooltip.css
│       │   ├── tree.css
│       │   ├── validatebox.css
│       │   └── window.css
│       └── icon.css
├── sitemap.xml
├── tags.html
├── theme-setup.md
└── works/
    ├── css/
    │   ├── common.css
    │   └── home.css
    ├── demo/
    │   ├── 03/
    │   │   ├── bd03.html
    │   │   └── css/
    │   │       └── main.css
    │   ├── 04/
    │   │   ├── css/
    │   │   │   ├── main.css
    │   │   │   └── r.css
    │   │   ├── data.js
    │   │   └── index.html
    │   ├── 06/
    │   │   ├── css/
    │   │   │   └── main.css
    │   │   └── index.html
    │   ├── 07/
    │   │   ├── css/
    │   │   │   └── main.css
    │   │   └── index.html
    │   ├── 08/
    │   │   ├── css/
    │   │   │   └── main.css
    │   │   └── index.html
    │   ├── ali/
    │   │   ├── actor.html
    │   │   ├── file/
    │   │   │   ├── abtest1120.css
    │   │   │   ├── ac_base.js
    │   │   │   ├── ac_retina.js
    │   │   │   ├── aliyun_core.js
    │   │   │   ├── aplus_v2.js
    │   │   │   ├── base.css
    │   │   │   ├── browserdetect.js
    │   │   │   ├── btm.v.3.css
    │   │   │   ├── event_mixins.js
    │   │   │   ├── header_footer.css
    │   │   │   ├── index.js
    │   │   │   ├── index_2.css
    │   │   │   ├── index_3.css
    │   │   │   ├── jquery.fullbg.js
    │   │   │   ├── organictabs.jquery.js
    │   │   │   ├── overview.css
    │   │   │   ├── overview.js
    │   │   │   ├── owl.carousel.js
    │   │   │   ├── pb_v.0.0.js
    │   │   │   ├── prototype.js
    │   │   │   ├── reveal.css
    │   │   │   ├── s_code_h.js
    │   │   │   ├── saved_resource
    │   │   │   ├── sizzle.js
    │   │   │   ├── swap_view.js
    │   │   │   └── yun4.htm
    │   │   └── startmove.js
    │   ├── d3/
    │   │   ├── d3.v3.js
    │   │   └── 新建文本文档.html
    │   ├── ee/
    │   │   ├── index.htm
    │   │   └── index_files/
    │   │       ├── analytics.js
    │   │       ├── backgroundClasses.css
    │   │       ├── dataset-shim.js
    │   │       ├── default-reset.css
    │   │       ├── default.css
    │   │       ├── impress.js
    │   │       ├── loadPresentation.js
    │   │       ├── main.css
    │   │       ├── onready.js
    │   │       ├── surfaceClasses.css
    │   │       └── web-fonts.css
    │   ├── html5/
    │   │   └── ali.html
    │   ├── qqzone-img/
    │   │   └── index.html
    │   ├── sm-meituan/
    │   │   ├── index.html
    │   │   └── main.css
    │   └── stream/
    │       ├── data.js
    │       ├── data2.js
    │       ├── float.html
    │       └── position.html
    ├── index.html
    ├── index_v1.html
    ├── index_v2.html
    ├── js/
    │   ├── data.js
    │   ├── index.js
    │   └── lib/
    │       ├── angular-1.3.0.js
    │       ├── angular-animate.js
    │       ├── angular-route.js
    │       ├── angular-ui-router.js
    │       ├── jquery.js
    │       └── ui-bootstrap-tpls-0.11.0.js
    ├── main.html
    └── template/
        ├── about.html
        ├── show-m.html
        └── show.html
Download .txt
SYMBOL INDEX (2193 symbols across 105 files)

FILE: Rakefile.rb
  function get_stdin (line 77) | def get_stdin(message)
  function ask (line 82) | def ask(message, valid_options)

FILE: assets/js/plugins/respond.js
  function callMedia (line 333) | function callMedia(){

FILE: common/js/ajax.js
  function Ajax (line 1) | function Ajax(parametObject) {

FILE: common/js/startmove.js
  function startMove (line 1) | function startMove(obj, json, fnEnd) {
  function getStyle (line 16) | function getStyle(obj, attr){
  function doMove (line 20) | function doMove(obj, json, speed, fnEnd) {

FILE: demo/javascript-seamless-handover/slide/js/startmove.js
  function startMove (line 1) | function startMove(obj, json, fnEnd) {
  function getStyle (line 16) | function getStyle(obj, attr){
  function doMove (line 20) | function doMove(obj, json, fnEnd) {

FILE: demo/my-show-4-angularjs/js/angular-1.3.0.js
  function minErr (line 36) | function minErr(module) {
  function isArrayLike (line 264) | function isArrayLike(obj) {
  function forEach (line 308) | function forEach(obj, iterator, context) {
  function sortedKeys (line 335) | function sortedKeys(obj) {
  function forEachSorted (line 345) | function forEachSorted(obj, iterator, context) {
  function reverseParams (line 359) | function reverseParams(iteratorFn) {
  function nextUid (line 371) | function nextUid() {
  function setHashKey (line 399) | function setHashKey(obj, h) {
  function extend (line 422) | function extend(dst) {
  function int (line 436) | function int(str) {
  function inherit (line 441) | function inherit(parent, extra) {
  function noop (line 461) | function noop() {}
  function identity (line 481) | function identity($) {return $;}
  function valueFn (line 485) | function valueFn(value) {return function() {return value;};}
  function isUndefined (line 499) | function isUndefined(value){return typeof value === 'undefined';}
  function isDefined (line 514) | function isDefined(value){return typeof value !== 'undefined';}
  function isObject (line 530) | function isObject(value){return value != null && typeof value === 'objec...
  function isString (line 545) | function isString(value){return typeof value === 'string';}
  function isNumber (line 560) | function isNumber(value){return typeof value === 'number';}
  function isDate (line 575) | function isDate(value) {
  function isArray (line 592) | function isArray(value) {
  function isFunction (line 609) | function isFunction(value){return typeof value === 'function';}
  function isRegExp (line 619) | function isRegExp(value) {
  function isWindow (line 631) | function isWindow(obj) {
  function isScope (line 636) | function isScope(obj) {
  function isFile (line 641) | function isFile(obj) {
  function isBlob (line 646) | function isBlob(obj) {
  function isBoolean (line 651) | function isBoolean(value) {
  function isElement (line 683) | function isElement(node) {
  function makeMap (line 693) | function makeMap(str) {
  function map (line 714) | function map(obj, iterator, context) {
  function size (line 735) | function size(obj, ownPropsOnly) {
  function includes (line 750) | function includes(array, obj) {
  function indexOf (line 754) | function indexOf(array, obj) {
  function arrayRemove (line 763) | function arrayRemove(array, value) {
  function isLeafNode (line 770) | function isLeafNode (node) {
  function copy (line 839) | function copy(source, destination) {
  function shallowCopy (line 883) | function shallowCopy(src, dst) {
  function equals (line 927) | function equals(o1, o2) {
  function csp (line 968) | function csp() {
  function concat (line 975) | function concat(array1, array2, index) {
  function sliceArgs (line 979) | function sliceArgs(args, startIndex) {
  function bind (line 1003) | function bind(self, fn) {
  function toJsonReplacer (line 1024) | function toJsonReplacer(key, value) {
  function toJson (line 1055) | function toJson(obj, pretty) {
  function fromJson (line 1073) | function fromJson(json) {
  function toBoolean (line 1080) | function toBoolean(value) {
  function startingTag (line 1095) | function startingTag(element) {
  function tryDecodeURIComponent (line 1127) | function tryDecodeURIComponent(value) {
  function parseKeyValue (line 1140) | function parseKeyValue(/**string*/keyValue) {
  function toKeyValue (line 1161) | function toKeyValue(obj) {
  function encodeUriSegment (line 1189) | function encodeUriSegment(val) {
  function encodeUriQuery (line 1208) | function encodeUriQuery(val, pctEncodeSpaces) {
  function getNgAttribute (line 1219) | function getNgAttribute(element, ngAttr) {
  function angularInit (line 1358) | function angularInit(element, bootstrap) {
  function bootstrap (line 1457) | function bootstrap(element, modules, config) {
  function snake_case (line 1504) | function snake_case(name, separator) {
  function bindJQuery (line 1511) | function bindJQuery() {
  function assertArg (line 1551) | function assertArg(arg, name, reason) {
  function assertArgFn (line 1558) | function assertArgFn(arg, name, acceptArrayAnnotation) {
  function assertNotHasOwnProperty (line 1573) | function assertNotHasOwnProperty(name, context) {
  function getter (line 1587) | function getter(obj, path, bindFnToScope) {
  function getBlockElements (line 1611) | function getBlockElements(nodes) {
  function setupModuleLoader (line 1639) | function setupModuleLoader(window) {
  function publishExternalAPI (line 2048) | function publishExternalAPI(angular){
  function jqNextId (line 2285) | function jqNextId() { return ++jqId; }
  function camelCase (line 2297) | function camelCase(name) {
  function jqLiteIsTextNode (line 2324) | function jqLiteIsTextNode(html) {
  function jqLiteBuildFragment (line 2328) | function jqLiteBuildFragment(html, context) {
  function jqLiteParseHTML (line 2365) | function jqLiteParseHTML(html, context) {
  function JQLite (line 2381) | function JQLite(element) {
  function jqLiteClone (line 2402) | function jqLiteClone(element) {
  function jqLiteDealoc (line 2406) | function jqLiteDealoc(element){
  function jqLiteOff (line 2413) | function jqLiteOff(element, type, fn, unsupported) {
  function jqLiteRemoveData (line 2438) | function jqLiteRemoveData(element, name) {
  function jqLiteExpandoStore (line 2457) | function jqLiteExpandoStore(element, key, value) {
  function jqLiteData (line 2472) | function jqLiteData(element, key, value) {
  function jqLiteHasClass (line 2498) | function jqLiteHasClass(element, selector) {
  function jqLiteRemoveClass (line 2504) | function jqLiteRemoveClass(element, cssClasses) {
  function jqLiteAddClass (line 2516) | function jqLiteAddClass(element, cssClasses) {
  function jqLiteAddNodes (line 2532) | function jqLiteAddNodes(root, elements) {
  function jqLiteController (line 2543) | function jqLiteController(element, name) {
  function jqLiteInheritedData (line 2547) | function jqLiteInheritedData(element, name, value) {
  function jqLiteEmpty (line 2570) | function jqLiteEmpty(element) {
  function trigger (line 2586) | function trigger() {
  function getBooleanAttrName (line 2633) | function getBooleanAttrName(element, name) {
  function getText (line 2740) | function getText(element, value) {
  function createEventHandler (line 2825) | function createEventHandler(element, events) {
  function hashKey (line 3128) | function hashKey(obj) {
  function HashMap (line 3149) | function HashMap(array){
  function anonFn (line 3248) | function anonFn(fn) {
  function annotate (line 3259) | function annotate(fn, strictDi, name) {
  function createInjector (line 3787) | function createInjector(modulesToLoad, strictDi) {
  function $AnchorScrollProvider (line 4058) | function $AnchorScrollProvider() {
  function async (line 4193) | function async(fn) {
  function $$AsyncCallbackProvider (line 4352) | function $$AsyncCallbackProvider(){
  function Browser (line 4384) | function Browser(window, document, $log, $sniffer) {
  function $BrowserProvider (line 4738) | function $BrowserProvider(){
  function $CacheFactoryProvider (line 4824) | function $CacheFactoryProvider() {
  function $TemplateCacheProvider (line 5136) | function $TemplateCacheProvider() {
  function $CompileProvider (line 5659) | function $CompileProvider($provide, $$sanitizeUriProvider) {
  function directiveNormalize (line 7132) | function directiveNormalize(name) {
  function nodesetLinkingFn (line 7179) | function nodesetLinkingFn(
  function directiveLinkingFn (line 7186) | function directiveLinkingFn(
  function tokenDifference (line 7194) | function tokenDifference(str1, str2) {
  function $ControllerProvider (line 7220) | function $ControllerProvider() {
  function $DocumentProvider (line 7322) | function $DocumentProvider(){
  function $ExceptionHandlerProvider (line 7360) | function $ExceptionHandlerProvider() {
  function parseHeaders (line 7374) | function parseHeaders(headers) {
  function headersGetter (line 7409) | function headersGetter(headers) {
  function transformData (line 7434) | function transformData(data, headers, fns) {
  function isSuccess (line 7446) | function isSuccess(status) {
  function $HttpProvider (line 7451) | function $HttpProvider() {
  function createXhr (line 8332) | function createXhr(method) {
  function $HttpBackendProvider (line 8362) | function $HttpBackendProvider() {
  function createHttpBackend (line 8368) | function createHttpBackend($browser, createXhr, $browserDefer, callbacks...
  function $InterpolateProvider (line 8564) | function $InterpolateProvider() {
  function $IntervalProvider (line 8906) | function $IntervalProvider() {
  function $LocaleProvider (line 9100) | function $LocaleProvider(){
  function encodePath (line 9173) | function encodePath(path) {
  function parseAbsoluteUrl (line 9184) | function parseAbsoluteUrl(absoluteUrl, locationObj, appBase) {
  function parseAppUrl (line 9193) | function parseAppUrl(relativeUrl, locationObj, appBase) {
  function beginsWith (line 9218) | function beginsWith(begin, whole) {
  function stripHash (line 9225) | function stripHash(url) {
  function stripFile (line 9231) | function stripFile(url) {
  function serverBase (line 9236) | function serverBase(url) {
  function LocationHtml5Url (line 9249) | function LocationHtml5Url(appBase, basePrefix) {
  function LocationHashbangUrl (line 9317) | function LocationHashbangUrl(appBase, hashPrefix) {
  function LocationHashbangInHtml5Url (line 9410) | function LocationHashbangInHtml5Url(appBase, hashPrefix) {
  function locationGetter (line 9656) | function locationGetter(property) {
  function locationGetterSetter (line 9663) | function locationGetterSetter(property, preprocess) {
  function $LocationProvider (line 9708) | function $LocationProvider(){
  function $LogProvider (line 9956) | function $LogProvider(){
  function ensureSafeMemberName (line 10106) | function ensureSafeMemberName(name, fullExpression) {
  function ensureSafeObject (line 10115) | function ensureSafeObject(obj, fullExpression) {
  function setter (line 10887) | function setter(obj, path, setValue, fullExp, options) {
  function cspSafeGetterFn (line 10913) | function cspSafeGetterFn(key0, key1, key2, key3, key4, fullExp, options) {
  function simpleGetterFn1 (line 10946) | function simpleGetterFn1(key0, fullExp) {
  function simpleGetterFn2 (line 10955) | function simpleGetterFn2(key0, key1, fullExp) {
  function getterFn (line 10966) | function getterFn(path, options, fullExp) {
  function $ParseProvider (line 11081) | function $ParseProvider() {
  function $QProvider (line 11327) | function $QProvider() {
  function qFactory (line 11345) | function qFactory(nextTick, exceptionHandler) {
  function $$RAFProvider (line 11683) | function $$RAFProvider(){ //rAF
  function $RootScopeProvider (line 11782) | function $RootScopeProvider(){
  function $$SanitizeUriProvider (line 12928) | function $$SanitizeUriProvider() {
  function escapeForRegexp (line 13014) | function escapeForRegexp(s) {
  function adjustMatcher (line 13020) | function adjustMatcher(matcher) {
  function adjustMatchers (line 13048) | function adjustMatchers(matchers) {
  function $SceDelegateProvider (line 13124) | function $SceDelegateProvider() {
  function $SceProvider (line 13655) | function $SceProvider() {
  function $SnifferProvider (line 14070) | function $SnifferProvider() {
  function $TimeoutProvider (line 14147) | function $TimeoutProvider() {
  function urlResolve (line 14293) | function urlResolve(url, base) {
  function urlIsSameOrigin (line 14327) | function urlIsSameOrigin(requestUrl) {
  function $WindowProvider (line 14373) | function $WindowProvider(){
  function $FilterProvider (line 14469) | function $FilterProvider($provide) {
  function filterFilter (line 14637) | function filterFilter() {
  function currencyFilter (line 14791) | function currencyFilter($locale) {
  function numberFilter (line 14851) | function numberFilter($locale) {
  function formatNumber (line 14860) | function formatNumber(number, pattern, groupSep, decimalSep, fractionSiz...
  function padNumber (line 14934) | function padNumber(num, digits, trim) {
  function dateGetter (line 14948) | function dateGetter(name, size, offset, trim) {
  function dateStrGetter (line 14959) | function dateStrGetter(name, shortForm) {
  function timeZoneGetter (line 14968) | function timeZoneGetter(date) {
  function getFirstThursdayOfYear (line 14978) | function getFirstThursdayOfYear(year) {
  function getThursdayThisWeek (line 14986) | function getThursdayThisWeek(datetime) {
  function weekGetter (line 14992) | function weekGetter(size) {
  function ampmGetter (line 15004) | function ampmGetter(date, formats) {
  function dateFilter (line 15124) | function dateFilter($locale) {
  function jsonFilter (line 15227) | function jsonFilter() {
  function limitToFilter (line 15324) | function limitToFilter(){
  function orderByFilter (line 15431) | function orderByFilter($parse){
  function ngDirective (line 15488) | function ngDirective(directive) {
  function FormController (line 15989) | function FormController(element, attrs, $scope, $animate) {
  function validate (line 17247) | function validate(ctrl, validatorName, validity, value){
  function addNativeHtml5Validators (line 17253) | function addNativeHtml5Validators(ctrl, validatorName, element) {
  function textInputType (line 17270) | function textInputType(scope, element, attr, ctrl, $sniffer, $browser) {
  function weekParser (line 17421) | function weekParser(isoWeek) {
  function createDateParser (line 17441) | function createDateParser(regexp, mapping) {
  function createDateInputType (line 17471) | function createDateInputType(type, regexp, parseDate, format) {
  function numberInputType (line 17523) | function numberInputType(scope, element, attr, ctrl, $sniffer, $browser) {
  function urlInputType (line 17568) | function urlInputType(scope, element, attr, ctrl, $sniffer, $browser) {
  function emailInputType (line 17579) | function emailInputType(scope, element, attr, ctrl, $sniffer, $browser) {
  function radioInputType (line 17590) | function radioInputType(scope, element, attr, ctrl) {
  function checkboxInputType (line 17614) | function checkboxInputType(scope, element, attr, ctrl) {
  function toggleValidCss (line 18008) | function toggleValidCss(isValid, validationErrorKey) {
  function getStringValue (line 18982) | function getStringValue() {
  function classDirective (line 18994) | function classDirective(name, selector) {
  function getBlockStart (line 21180) | function getBlockStart(block) {
  function getBlockEnd (line 21184) | function getBlockEnd(block) {
  function setupAsSingle (line 22143) | function setupAsSingle(scope, selectElement, ngModelCtrl, selectCtrl) {
  function setupAsMultiple (line 22168) | function setupAsMultiple(scope, selectElement, ctrl) {
  function setupAsOptions (line 22199) | function setupAsOptions(scope, selectElement, ctrl) {

FILE: demo/my-show-4-angularjs/js/angular-animate.js
  function extractElementNode (line 354) | function extractElementNode(element) {
  function prepareElement (line 363) | function prepareElement(element) {
  function stripCommentsFromElement (line 367) | function stripCommentsFromElement(element) {
  function isMatchingElement (line 371) | function isMatchingElement(elm1, elm2) {
  function lookup (line 400) | function lookup(name) {
  function animationRunner (line 430) | function animationRunner(element, animationEvent, className) {
  function performAnimation (line 878) | function performAnimation(animationEvent, className, element, parentElem...
  function cancelChildAnimations (line 1082) | function cancelChildAnimations(element) {
  function cleanup (line 1100) | function cleanup(element, className) {
  function animationsDisabled (line 1122) | function animationsDisabled(element, parentElement) {
  function afterReflow (line 1198) | function afterReflow(element, callback) {
  function animationCloseHandler (line 1217) | function animationCloseHandler(element, totalTime) {
  function closeAllAnimations (line 1241) | function closeAllAnimations(elements) {
  function getElementAnimationDetails (line 1250) | function getElementAnimationDetails(element, cacheKey) {
  function parseMaxTime (line 1308) | function parseMaxTime(str) {
  function getCacheKey (line 1319) | function getCacheKey(element) {
  function animateSetup (line 1329) | function animateSetup(animationEvent, element, className) {
  function animateRun (line 1389) | function animateRun(animationEvent, element, className, activeAnimationC...
  function prepareStaggerDelay (line 1513) | function prepareStaggerDelay(delayStyle, staggerDelay, index) {
  function animateBefore (line 1522) | function animateBefore(animationEvent, element, className, calculationDe...
  function animateAfter (line 1530) | function animateAfter(animationEvent, element, className, afterAnimation...
  function animate (line 1539) | function animate(animationEvent, element, className, animationComplete) {
  function animateClose (line 1567) | function animateClose(element, className) {
  function suffixClasses (line 1638) | function suffixClasses(classes, suffix) {

FILE: demo/my-show-4-angularjs/js/angular-route.js
  function $RouteProvider (line 42) | function $RouteProvider(){
  function $RouteParamsProvider (line 638) | function $RouteParamsProvider() {
  function ngViewFactory (line 822) | function ngViewFactory(   $route,   $anchorScroll,   $animate) {
  function ngViewFillContentFactory (line 898) | function ngViewFillContentFactory($compile, $controller, $route) {

FILE: demo/my-show-4-angularjs/js/angular-ui-router.js
  function inherit (line 27) | function inherit(parent, extra) {
  function merge (line 31) | function merge(dst) {
  function ancestors (line 49) | function ancestors(first, second) {
  function keys (line 65) | function keys(object) {
  function arraySearch (line 84) | function arraySearch(array, value) {
  function inheritParams (line 108) | function inheritParams(currentParams, newParams, $current, $to) {
  function normalize (line 131) | function normalize(keys, values) {
  function equalForKeys (line 150) | function equalForKeys(a, b, keys) {
  function filterByKeys (line 170) | function filterByKeys(keys, values) {
  function $Resolve (line 272) | function $Resolve(  $q,    $injector) {
  function $TemplateFactory (line 516) | function $TemplateFactory(  $http,   $templateCache,   $injector) {
  function UrlMatcher (line 672) | function UrlMatcher(pattern) {
  function $UrlMatcherFactory (line 878) | function $UrlMatcherFactory() {
  function $UrlRouterProvider (line 935) | function $UrlRouterProvider(  $urlMatcherFactory) {
  function $StateProvider (line 1216) | function $StateProvider(   $urlRouterProvider,   $urlMatcherFactory,    ...
  function $ViewProvider (line 2400) | function $ViewProvider() {
  function $ViewScrollProvider (line 2477) | function $ViewScrollProvider() {
  function $ViewDirective (line 2637) | function $ViewDirective(   $state,   $injector,   $uiViewScroll) {
  function $ViewDirectiveFill (line 2767) | function $ViewDirectiveFill ($compile, $controller, $state) {
  function parseStateRef (line 2814) | function parseStateRef(ref) {
  function stateContext (line 2820) | function stateContext(el) {
  function $StateRefDirective (line 2891) | function $StateRefDirective($state, $timeout) {
  function $StateActiveDirective (line 3003) | function $StateActiveDirective($state, $stateParams, $interpolate) {
  function $IsStateFilter (line 3051) | function $IsStateFilter($state) {
  function $IncludedByStateFilter (line 3067) | function $IncludedByStateFilter($state) {
  function $RouteProvider (line 3096) | function $RouteProvider(  $stateProvider,    $urlRouterProvider) {

FILE: demo/my-show-4-angularjs/js/ui-bootstrap-tpls-0.11.0.js
  function findEndEventName (line 81) | function findEndEventName(endEventNames) {
  function doTransition (line 103) | function doTransition(change) {
  function expand (line 120) | function expand() {
  function expandDone (line 130) | function expandDone() {
  function collapse (line 136) | function collapse() {
  function collapseDone (line 153) | function collapseDone() {
  function getTrueValue (line 376) | function getTrueValue() {
  function getFalseValue (line 380) | function getFalseValue() {
  function getCheckboxValue (line 384) | function getCheckboxValue(attributeValue, defaultValue) {
  function goNext (line 438) | function goNext() {
  function transitionDone (line 470) | function transitionDone(next, current) {
  function restartTimer (line 510) | function restartTimer() {
  function resetTimer (line 518) | function resetTimer() {
  function timerFn (line 525) | function timerFn() {
  function isValid (line 813) | function isValid(year, month, date) {
  function getStyle (line 836) | function getStyle(el, cssprop) {
  function isStaticPositioned (line 850) | function isStaticPositioned(element) {
  function getDaysInMonth (line 1192) | function getDaysInMonth( year, month ) {
  function getDates (line 1196) | function getDates(startDate, n) {
  function getISO8601WeekNumber (line 1250) | function getISO8601WeekNumber(date) {
  function getStartingYear (line 1354) | function getStartingYear( year ) {
  function cameltoDash (line 1446) | function cameltoDash( string ){
  function parseDate (line 1470) | function parseDate(viewValue) {
  function backdropIndex (line 1879) | function backdropIndex() {
  function removeModalWindow (line 1896) | function removeModalWindow(modalInstance) {
  function checkRemoveBackdrop (line 1912) | function checkRemoveBackdrop() {
  function removeAfterAnimate (line 1925) | function removeAfterAnimate(domEl, scope, emulateTime, done) {
  function getTemplatePromise (line 2048) | function getTemplatePromise(options) {
  function getResolvePromises (line 2055) | function getResolvePromises(resolves) {
  function makePage (line 2260) | function makePage(number, text, isActive) {
  function getPages (line 2268) | function getPages(currentPage, totalPages) {
  function snake_case (line 2415) | function snake_case(name){
  function getTriggers (line 2445) | function getTriggers ( trigger ) {
  function toggleTooltipBind (line 2496) | function toggleTooltipBind () {
  function showTooltipBind (line 2505) | function showTooltipBind() {
  function hideTooltipBind (line 2521) | function hideTooltipBind () {
  function show (line 2528) | function show() {
  function hide (line 2569) | function hide() {
  function createTooltip (line 2589) | function createTooltip() {
  function removeTooltip (line 2600) | function removeTooltip() {
  function isTabHeading (line 3155) | function isTabHeading(node) {
  function getHoursFromTemplate (line 3233) | function getHoursFromTemplate ( ) {
  function getMinutesFromTemplate (line 3251) | function getMinutesFromTemplate() {
  function pad (line 3256) | function pad( value ) {
  function refresh (line 3357) | function refresh( keyboardChange ) {
  function makeValid (line 3363) | function makeValid() {
  function updateTemplate (line 3369) | function updateTemplate( keyboardChange ) {
  function addMinutes (line 3381) | function addMinutes( minutes ) {
  function escapeRegexp (line 3793) | function escapeRegexp(queryToEscape) {

FILE: ppt/js/highlight/highlight.pack.js
  function m (line 1) | function m(p){return p.replace(/&/gm,"&amp;").replace(/</gm,"&lt;")}
  function c (line 1) | function c(r,q,p){return RegExp(q,"m"+(r.cI?"i":"")+(p?"g":""))}
  function j (line 1) | function j(r){for(var p=0;p<r.childNodes.length;p++){var q=r.childNodes[...
  function g (line 1) | function g(t,s){var r="";for(var q=0;q<t.childNodes.length;q++){if(t.chi...
  function a (line 1) | function a(s){var q=s.className.split(/\s+/);q=q.concat(s.parentNode.cla...
  function b (line 1) | function b(p){var q=[];(function(s,t){for(var r=0;r<s.childNodes.length;...
  function l (line 1) | function l(y,z,x){var r=0;var w="";var t=[];function u(){if(y.length&&z....
  function i (line 1) | function i(){function p(w,u,x){if(w.compiled){return}var t;if(!x){w.bR=c...
  function e (line 1) | function e(J,D){if(!i.called){i();i.called=true}function z(r,M){for(var ...
  function f (line 1) | function f(t){var r={keyword_count:0,r:0,value:m(t)};var q=r;for(var p i...
  function h (line 1) | function h(r,q,p){if(q){r=r.replace(/^((<[^>]+>|\t)+)/gm,function(t,w,v,...
  function o (line 1) | function o(u,x,q){var y=g(u,q);var s=a(u);var w,r;if(s=="no-highlight"){...
  function k (line 1) | function k(){if(k.called){return}k.called=true;var r=document.getElement...
  function n (line 1) | function n(){if(window.addEventListener){window.addEventListener("DOMCon...
  function c (line 1) | function c(f,e){return(e==undefined||(!f.cN&&e.cN=="tag")||f.cN=="value")}
  function d (line 1) | function d(j,e){var h={};for(var g in j){if(g!="contains"){h[g]=j[g]}var...

FILE: ppt/js/highlight/hljs-0.8.js
  function k (line 1) | function k(v){return v.replace(/&/gm,"&amp;").replace(/</gm,"&lt;").repl...
  function t (line 1) | function t(v){return v.nodeName.toLowerCase()}
  function i (line 1) | function i(w,x){var v=w&&w.exec(x);return v&&v.index==0}
  function d (line 1) | function d(v){return Array.prototype.map.call(v.childNodes,function(w){i...
  function r (line 1) | function r(w){var v=(w.className+" "+(w.parentNode?w.parentNode.classNam...
  function o (line 1) | function o(x,y){var v={};for(var w in x){v[w]=x[w]}if(y){for(var w in y)...
  function u (line 1) | function u(x){var v=[];(function w(y,z){for(var A=y.firstChild;A;A=A.nex...
  function q (line 1) | function q(w,y,C){var x=0;var F="";var z=[];function B(){if(!w.length||!...
  function m (line 1) | function m(y){function v(z){return(z&&z.source)||z}function w(A,z){retur...
  function c (line 1) | function c(S,L,J,R){function v(U,V){for(var T=0;T<V.c.length;T++){if(i(V...
  function g (line 1) | function g(y,x){x=x||b.languages||Object.keys(f);var v={r:0,value:k(y)};...
  function h (line 1) | function h(v){if(b.tabReplace){v=v.replace(/^((<[^>]+>|\t)+)/gm,function...
  function p (line 1) | function p(z){var y=d(z);var A=r(z);if(A=="no-highlight"){return}var v=A...
  function s (line 1) | function s(v){b=o(b,v)}
  function l (line 1) | function l(){if(l.called){return}l.called=true;var v=document.querySelec...
  function a (line 1) | function a(){addEventListener("DOMContentLoaded",l,false);addEventListen...
  function e (line 1) | function e(v,x){var w=f[v]=x(this);if(w.aliases){w.aliases.forEach(funct...
  function j (line 1) | function j(v){return f[v]||f[n[v]]}

FILE: ppt/js/img.screenfull.js
  function show (line 10) | function show(t) {

FILE: ppt/js/mixjs/lib/event/wait.js
  function getUUid (line 24) | function getUUid() {
  function Wait (line 30) | function Wait() {
  function destroy (line 183) | function destroy(obj) {

FILE: ppt/js/mixjs/lib/mix-0.2.js
  function defined (line 205) | function defined(module) {
  function loaded (line 215) | function loaded(file) {
  function dealArr (line 227) | function dealArr(arr, isFromDefine, mName) {
  function checkDeps (line 260) | function checkDeps(module) {
  function Module (line 326) | function Module(id, deps, maker, root) {
  function getPath (line 424) | function getPath(url, root) {
  function Queue (line 474) | function Queue(id) {
  function loadJS (line 547) | function loadJS(url, callback, fail, charset) {
  function jsCallback (line 570) | function jsCallback(node, callback, fail) {
  function jsGetCallback (line 582) | function jsGetCallback(node, cb) {
  function loadCSS (line 609) | function loadCSS(url, callback, fail) {
  function poll (line 650) | function poll(node, callback) {
  function isType (line 692) | function isType(obj, type) {
  function mix (line 702) | function mix(target, source) {

FILE: ppt/js/mixjs/lib/mix.0.3.0.js
  function isType (line 77) | function isType(obj, type) {
  function Module (line 90) | function Module(id, deps, factory, root) {
  function isAMD (line 283) | function isAMD(obj) {
  function defined (line 293) | function defined(moduleID) {
  function Promise (line 300) | function Promise() {
  function isPromise (line 383) | function isPromise(o) {
  function getPath (line 393) | function getPath(url, root) {
  function loadJS (line 449) | function loadJS(src, callback, attrs, timeout, fail, complete) {
  function removeNode (line 506) | function removeNode(node) {
  function loadCSS (line 528) | function loadCSS(href, callback, attrs, timeout, fail, complete) {
  function destroy (line 738) | function destroy(obj) {
  function mix (line 760) | function mix(target, source, ride) {

FILE: ppt/js/mixjs/src/Module.js
  function Module (line 9) | function Module(id, deps, factory, root) {
  function isAMD (line 202) | function isAMD(obj) {
  function defined (line 212) | function defined(moduleID) {

FILE: ppt/js/mixjs/src/Promise.js
  function Promise (line 5) | function Promise() {
  function isPromise (line 88) | function isPromise(o) {

FILE: ppt/js/mixjs/src/core.js
  function destroy (line 113) | function destroy(obj) {
  function mix (line 135) | function mix(target, source, ride) {

FILE: ppt/js/mixjs/src/getPath.js
  function getPath (line 8) | function getPath(url, root) {

FILE: ppt/js/mixjs/src/loadcss-img.js
  function loadCSS (line 13) | function loadCSS(href, callback, attrs, timeout, fail, complete) {

FILE: ppt/js/mixjs/src/loadcss.js
  function loadCSS (line 12) | function loadCSS(href, callback, attrs, timeout, fail, complete) {
  function poll (line 103) | function poll(node, callback) {

FILE: ppt/js/mixjs/src/loadjs.js
  function loadJS (line 11) | function loadJS(src, callback, attrs, timeout, fail, complete) {
  function removeNode (line 68) | function removeNode(node) {

FILE: ppt/js/mixjs/src/typeof.js
  function isType (line 30) | function isType(obj, type) {

FILE: ppt/js/nodeppt.control.js
  function getType (line 11) | function getType(obj) {

FILE: ppt/js/nodeppt.control.postMessage.js
  function parseQuery (line 6) | function parseQuery(url) {
  function time2str (line 142) | function time2str(time) {

FILE: ppt/js/nodeppt.control.socket.js
  function time2str (line 6) | function time2str(time) {

FILE: ppt/js/nodeppt.js
  function queryToJson (line 33) | function queryToJson(url) {
  function setProgress (line 52) | function setProgress() {
  function toArray (line 61) | function toArray(arrayLike) {
  function $ (line 66) | function $(selector, context) {
  function $$ (line 72) | function $$(id) {
  function prevSlide (line 78) | function prevSlide(isControl) {
  function nextSlide (line 89) | function nextSlide(isControl) {
  function slideInCallBack (line 108) | function slideInCallBack() {
  function slideInCallBack_ (line 115) | function slideInCallBack_() {
  function slideOutCallBack (line 138) | function slideOutCallBack(prev) {
  function slideOutCallBack_ (line 150) | function slideOutCallBack_(prev) {
  function preload (line 158) | function preload(node) {
  function buildNextItem (line 183) | function buildNextItem(iscontrol) {
  function buildPrevItem (line 226) | function buildPrevItem() {
  function makeBuildLists (line 281) | function makeBuildLists() {
  function doSlide (line 306) | function doSlide(direction, isSync) {
  function updateSlideClass (line 333) | function updateSlideClass() {
  function overview (line 374) | function overview(isFromControl) {
  function focusOverview_ (line 382) | function focusOverview_() {
  function updateSlideClass_ (line 394) | function updateSlideClass_(slideNo, className, pageClass) {
  function showTips (line 417) | function showTips(msg) {
  function evtDocUp (line 432) | function evtDocUp(e) {
  function evtTouchStart (line 530) | function evtTouchStart(event) {
  function evtTouchMove (line 544) | function evtTouchMove(event) {
  function evtTouchEnd (line 558) | function evtTouchEnd(event) {
  function cancelTouch (line 573) | function cancelTouch() {
  function bindEvent (line 579) | function bindEvent() {
  function drawCanvasReady (line 650) | function drawCanvasReady() {
  function showPaint (line 660) | function showPaint(isFromControl) {
  function stopSelect (line 696) | function stopSelect() {
  function clearPaint (line 701) | function clearPaint() {
  function proxyFn (line 799) | function proxyFn(fnName, args) {
  function initVar (line 824) | function initVar() {
  function fullImg (line 844) | function fullImg() {
  function loadTheme (line 853) | function loadTheme() {
  function init (line 860) | function init(options) {

FILE: ppt/js/prettify.js
  function L (line 2) | function L(a){function m(a){var f=a.charCodeAt(0);if(f!==92)return f;var...
  function M (line 6) | function M(a){function m(a){switch(a.nodeType){case 1:if(e.test(a.classN...
  function B (line 7) | function B(a,m,e,h){m&&(a={a:m,d:a},e(a),h.push.apply(h,a.e))}
  function x (line 7) | function x(a,m){function e(a){for(var l=a.d,p=[l,"pln"],d=0,g=a.a.match(...
  function u (line 9) | function u(a){var m=[],e=[];a.tripleQuotedStrings?m.push(["str",/^(?:'''...
  function D (line 12) | function D(a,m){function e(a){switch(a.nodeType){case 1:if(k.test(a.clas...
  function k (line 15) | function k(a,m){for(var e=m.length;--e>=0;){var h=m[e];A.hasOwnProperty(...
  function C (line 15) | function C(a,m){if(!a||!A.hasOwnProperty(a))a=/^\s*</.test(m)?"default-m...
  function E (line 15) | function E(a){var m=
  function m (line 25) | function m(){for(var e=window.PR_SHOULD_USE_CONTINUATION?l.now()+250:Inf...

FILE: ppt/js/qrcode.js
  function QR8bitByte (line 29) | function QR8bitByte(data){this.mode=QRMode.MODE_8BIT_BYTE;this.data=data;}
  function QRCodeModel (line 30) | function QRCodeModel(typeNumber,errorCorrectLevel){this.typeNumber=typeN...
  function QRPolynomial (line 83) | function QRPolynomial(num,shift){if(num.length==undefined){throw new Err...
  function QRRSBlock (line 90) | function QRRSBlock(totalCount,dataCount){this.totalCount=totalCount;this...
  function QRBitBuffer (line 93) | function QRBitBuffer(){this.buffer=[];this.length=0;}
  function _isSupportCanvas (line 98) | function _isSupportCanvas() {
  function _getAndroid (line 103) | function _getAndroid() {
  function _onMakeImage (line 183) | function _onMakeImage() {
  function _safeSetDataURI (line 217) | function _safeSetDataURI(fSuccess, fFail) {
  function _getTypeNumber (line 366) | function _getTypeNumber(sText, nCorrectLevel) {

FILE: ppt/js/shake.js
  function Shake (line 23) | function Shake() {

FILE: ppt/js/socket.io.js
  function f (line 355) | function f() {}
  function EventEmitter (line 478) | function EventEmitter () {}
  function on (line 513) | function on () {
  function f (line 665) | function f(n) {
  function date (line 670) | function date(d, key) {
  function quote (line 696) | function quote(string) {
  function str (line 712) | function str(key, holder) {
  function walk (line 887) | function walk(holder, key) {
  function Transport (line 1246) | function Transport (socket, sessid) {
  function Socket (line 1491) | function Socket (options) {
  function empty (line 1583) | function empty () { }
  function complete (line 1589) | function complete (data) {
  function connect (line 1682) | function connect (transports){
  function reset (line 1947) | function reset () {
  function maybeReconnect (line 1972) | function maybeReconnect () {
  function SocketNamespace (line 2039) | function SocketNamespace (socket, name) {
  function ack (line 2159) | function ack () {
  function Flag (line 2229) | function Flag (nsp, name) {
  function WS (line 2286) | function WS (socket) {
  function XHR (line 2462) | function XHR (socket) {
  function empty (line 2531) | function empty () { }
  function stateChange (line 2537) | function stateChange () {
  function onload (line 2550) | function onload () {
  function HTMLFile (line 2680) | function HTMLFile (socket) {
  function XHRPolling (line 2849) | function XHRPolling () {
  function empty (line 2894) | function empty () {}
  function stateChange (line 2901) | function stateChange () {
  function onload (line 2914) | function onload () {
  function onerror (line 2921) | function onerror () {
  function JSONPPolling (line 3023) | function JSONPPolling (socket) {
  function complete (line 3090) | function complete () {
  function initIframe (line 3095) | function initIframe () {

FILE: ppt/js/zoom.js
  function magnify (line 87) | function magnify(rect, scale) {
  function pan (line 161) | function pan() {
  function getScrollOffset (line 186) | function getScrollOffset() {

FILE: ppt/node-generator-koa/js/highlight/highlight.pack.js
  function m (line 1) | function m(p){return p.replace(/&/gm,"&amp;").replace(/</gm,"&lt;")}
  function c (line 1) | function c(r,q,p){return RegExp(q,"m"+(r.cI?"i":"")+(p?"g":""))}
  function j (line 1) | function j(r){for(var p=0;p<r.childNodes.length;p++){var q=r.childNodes[...
  function g (line 1) | function g(t,s){var r="";for(var q=0;q<t.childNodes.length;q++){if(t.chi...
  function a (line 1) | function a(s){var q=s.className.split(/\s+/);q=q.concat(s.parentNode.cla...
  function b (line 1) | function b(p){var q=[];(function(s,t){for(var r=0;r<s.childNodes.length;...
  function l (line 1) | function l(y,z,x){var r=0;var w="";var t=[];function u(){if(y.length&&z....
  function i (line 1) | function i(){function p(w,u,x){if(w.compiled){return}var t;if(!x){w.bR=c...
  function e (line 1) | function e(J,D){if(!i.called){i();i.called=true}function z(r,M){for(var ...
  function f (line 1) | function f(t){var r={keyword_count:0,r:0,value:m(t)};var q=r;for(var p i...
  function h (line 1) | function h(r,q,p){if(q){r=r.replace(/^((<[^>]+>|\t)+)/gm,function(t,w,v,...
  function o (line 1) | function o(u,x,q){var y=g(u,q);var s=a(u);var w,r;if(s=="no-highlight"){...
  function k (line 1) | function k(){if(k.called){return}k.called=true;var r=document.getElement...
  function n (line 1) | function n(){if(window.addEventListener){window.addEventListener("DOMCon...
  function c (line 1) | function c(f,e){return(e==undefined||(!f.cN&&e.cN=="tag")||f.cN=="value")}
  function d (line 1) | function d(j,e){var h={};for(var g in j){if(g!="contains"){h[g]=j[g]}var...

FILE: ppt/node-generator-koa/js/highlight/hljs-0.8.js
  function k (line 1) | function k(v){return v.replace(/&/gm,"&amp;").replace(/</gm,"&lt;").repl...
  function t (line 1) | function t(v){return v.nodeName.toLowerCase()}
  function i (line 1) | function i(w,x){var v=w&&w.exec(x);return v&&v.index==0}
  function d (line 1) | function d(v){return Array.prototype.map.call(v.childNodes,function(w){i...
  function r (line 1) | function r(w){var v=(w.className+" "+(w.parentNode?w.parentNode.classNam...
  function o (line 1) | function o(x,y){var v={};for(var w in x){v[w]=x[w]}if(y){for(var w in y)...
  function u (line 1) | function u(x){var v=[];(function w(y,z){for(var A=y.firstChild;A;A=A.nex...
  function q (line 1) | function q(w,y,C){var x=0;var F="";var z=[];function B(){if(!w.length||!...
  function m (line 1) | function m(y){function v(z){return(z&&z.source)||z}function w(A,z){retur...
  function c (line 1) | function c(S,L,J,R){function v(U,V){for(var T=0;T<V.c.length;T++){if(i(V...
  function g (line 1) | function g(y,x){x=x||b.languages||Object.keys(f);var v={r:0,value:k(y)};...
  function h (line 1) | function h(v){if(b.tabReplace){v=v.replace(/^((<[^>]+>|\t)+)/gm,function...
  function p (line 1) | function p(z){var y=d(z);var A=r(z);if(A=="no-highlight"){return}var v=A...
  function s (line 1) | function s(v){b=o(b,v)}
  function l (line 1) | function l(){if(l.called){return}l.called=true;var v=document.querySelec...
  function a (line 1) | function a(){addEventListener("DOMContentLoaded",l,false);addEventListen...
  function e (line 1) | function e(v,x){var w=f[v]=x(this);if(w.aliases){w.aliases.forEach(funct...
  function j (line 1) | function j(v){return f[v]||f[n[v]]}

FILE: ppt/node-generator-koa/js/img.screenfull.js
  function show (line 10) | function show(t) {

FILE: ppt/node-generator-koa/js/mixjs/lib/event/wait.js
  function getUUid (line 24) | function getUUid() {
  function Wait (line 30) | function Wait() {
  function destroy (line 183) | function destroy(obj) {

FILE: ppt/node-generator-koa/js/mixjs/lib/mix-0.2.js
  function defined (line 205) | function defined(module) {
  function loaded (line 215) | function loaded(file) {
  function dealArr (line 227) | function dealArr(arr, isFromDefine, mName) {
  function checkDeps (line 260) | function checkDeps(module) {
  function Module (line 326) | function Module(id, deps, maker, root) {
  function getPath (line 424) | function getPath(url, root) {
  function Queue (line 474) | function Queue(id) {
  function loadJS (line 547) | function loadJS(url, callback, fail, charset) {
  function jsCallback (line 570) | function jsCallback(node, callback, fail) {
  function jsGetCallback (line 582) | function jsGetCallback(node, cb) {
  function loadCSS (line 609) | function loadCSS(url, callback, fail) {
  function poll (line 650) | function poll(node, callback) {
  function isType (line 692) | function isType(obj, type) {
  function mix (line 702) | function mix(target, source) {

FILE: ppt/node-generator-koa/js/mixjs/lib/mix.0.3.0.js
  function isType (line 77) | function isType(obj, type) {
  function Module (line 90) | function Module(id, deps, factory, root) {
  function isAMD (line 283) | function isAMD(obj) {
  function defined (line 293) | function defined(moduleID) {
  function Promise (line 300) | function Promise() {
  function isPromise (line 383) | function isPromise(o) {
  function getPath (line 393) | function getPath(url, root) {
  function loadJS (line 449) | function loadJS(src, callback, attrs, timeout, fail, complete) {
  function removeNode (line 506) | function removeNode(node) {
  function loadCSS (line 528) | function loadCSS(href, callback, attrs, timeout, fail, complete) {
  function destroy (line 738) | function destroy(obj) {
  function mix (line 760) | function mix(target, source, ride) {

FILE: ppt/node-generator-koa/js/mixjs/src/Module.js
  function Module (line 9) | function Module(id, deps, factory, root) {
  function isAMD (line 202) | function isAMD(obj) {
  function defined (line 212) | function defined(moduleID) {

FILE: ppt/node-generator-koa/js/mixjs/src/Promise.js
  function Promise (line 5) | function Promise() {
  function isPromise (line 88) | function isPromise(o) {

FILE: ppt/node-generator-koa/js/mixjs/src/core.js
  function destroy (line 113) | function destroy(obj) {
  function mix (line 135) | function mix(target, source, ride) {

FILE: ppt/node-generator-koa/js/mixjs/src/getPath.js
  function getPath (line 8) | function getPath(url, root) {

FILE: ppt/node-generator-koa/js/mixjs/src/loadcss-img.js
  function loadCSS (line 13) | function loadCSS(href, callback, attrs, timeout, fail, complete) {

FILE: ppt/node-generator-koa/js/mixjs/src/loadcss.js
  function loadCSS (line 12) | function loadCSS(href, callback, attrs, timeout, fail, complete) {
  function poll (line 103) | function poll(node, callback) {

FILE: ppt/node-generator-koa/js/mixjs/src/loadjs.js
  function loadJS (line 11) | function loadJS(src, callback, attrs, timeout, fail, complete) {
  function removeNode (line 68) | function removeNode(node) {

FILE: ppt/node-generator-koa/js/mixjs/src/typeof.js
  function isType (line 30) | function isType(obj, type) {

FILE: ppt/node-generator-koa/js/nodeppt.control.js
  function doItem (line 8) | function doItem(id, itemID) {
  function getType (line 24) | function getType(obj) {

FILE: ppt/node-generator-koa/js/nodeppt.control.postMessage.js
  function parseQuery (line 6) | function parseQuery(url) {
  function time2str (line 140) | function time2str(time) {

FILE: ppt/node-generator-koa/js/nodeppt.control.socket.js
  function time2str (line 6) | function time2str(time) {

FILE: ppt/node-generator-koa/js/nodeppt.js
  function setProgress (line 34) | function setProgress() {
  function toArray (line 44) | function toArray(arrayLike) {
  function $ (line 49) | function $(selector, context) {
  function $$ (line 55) | function $$(id) {
  function prevSlide (line 61) | function prevSlide() {
  function nextSlide (line 69) | function nextSlide() {
  function slideInCallBack (line 86) | function slideInCallBack() {
  function slideInCallBack_ (line 94) | function slideInCallBack_() {
  function slideOutCallBack (line 116) | function slideOutCallBack(prev) {
  function slideOutCallBack_ (line 128) | function slideOutCallBack_(prev) {
  function preload (line 137) | function preload(node) {
  function buildNextItem (line 161) | function buildNextItem() {
  function makeBuildLists (line 197) | function makeBuildLists() {
  function doSlide (line 221) | function doSlide(slideID, isSync) {
  function updateSlideClass (line 249) | function updateSlideClass() {
  function overview (line 290) | function overview(isFromControl) {
  function focusOverview_ (line 298) | function focusOverview_() {
  function updateSlideClass_ (line 309) | function updateSlideClass_(slideNo, className, pageClass) {
  function showTips (line 333) | function showTips(msg) {
  function evtDocUp (line 349) | function evtDocUp(e) {
  function evtTouchStart (line 446) | function evtTouchStart(event) {
  function evtTouchMove (line 460) | function evtTouchMove(event) {
  function evtTouchEnd (line 474) | function evtTouchEnd(event) {
  function cancelTouch (line 489) | function cancelTouch() {
  function bindEvent (line 495) | function bindEvent() {
  function drawCanvasReady (line 566) | function drawCanvasReady() {
  function showPaint (line 576) | function showPaint(isFromControl) {
  function stopSelect (line 612) | function stopSelect() {
  function clearPaint (line 617) | function clearPaint() {
  function proxyFn (line 715) | function proxyFn(fnName, args) {
  function initVar (line 741) | function initVar() {
  function fullImg (line 763) | function fullImg() {
  function init (line 773) | function init(options) {

FILE: ppt/node-generator-koa/js/prettify.js
  function L (line 2) | function L(a){function m(a){var f=a.charCodeAt(0);if(f!==92)return f;var...
  function M (line 6) | function M(a){function m(a){switch(a.nodeType){case 1:if(e.test(a.classN...
  function B (line 7) | function B(a,m,e,h){m&&(a={a:m,d:a},e(a),h.push.apply(h,a.e))}
  function x (line 7) | function x(a,m){function e(a){for(var l=a.d,p=[l,"pln"],d=0,g=a.a.match(...
  function u (line 9) | function u(a){var m=[],e=[];a.tripleQuotedStrings?m.push(["str",/^(?:'''...
  function D (line 12) | function D(a,m){function e(a){switch(a.nodeType){case 1:if(k.test(a.clas...
  function k (line 15) | function k(a,m){for(var e=m.length;--e>=0;){var h=m[e];A.hasOwnProperty(...
  function C (line 15) | function C(a,m){if(!a||!A.hasOwnProperty(a))a=/^\s*</.test(m)?"default-m...
  function E (line 15) | function E(a){var m=
  function m (line 25) | function m(){for(var e=window.PR_SHOULD_USE_CONTINUATION?l.now()+250:Inf...

FILE: ppt/node-generator-koa/js/qrcode.js
  function QR8bitByte (line 29) | function QR8bitByte(data){this.mode=QRMode.MODE_8BIT_BYTE;this.data=data;}
  function QRCodeModel (line 30) | function QRCodeModel(typeNumber,errorCorrectLevel){this.typeNumber=typeN...
  function QRPolynomial (line 83) | function QRPolynomial(num,shift){if(num.length==undefined){throw new Err...
  function QRRSBlock (line 90) | function QRRSBlock(totalCount,dataCount){this.totalCount=totalCount;this...
  function QRBitBuffer (line 93) | function QRBitBuffer(){this.buffer=[];this.length=0;}
  function _isSupportCanvas (line 98) | function _isSupportCanvas() {
  function _getAndroid (line 103) | function _getAndroid() {
  function _onMakeImage (line 183) | function _onMakeImage() {
  function _safeSetDataURI (line 217) | function _safeSetDataURI(fSuccess, fFail) {
  function _getTypeNumber (line 366) | function _getTypeNumber(sText, nCorrectLevel) {

FILE: ppt/node-generator-koa/js/shake.js
  function Shake (line 23) | function Shake() {

FILE: ppt/node-generator-koa/js/socket.io.js
  function f (line 355) | function f() {}
  function EventEmitter (line 478) | function EventEmitter () {}
  function on (line 513) | function on () {
  function f (line 665) | function f(n) {
  function date (line 670) | function date(d, key) {
  function quote (line 696) | function quote(string) {
  function str (line 712) | function str(key, holder) {
  function walk (line 887) | function walk(holder, key) {
  function Transport (line 1246) | function Transport (socket, sessid) {
  function Socket (line 1491) | function Socket (options) {
  function empty (line 1583) | function empty () { }
  function complete (line 1589) | function complete (data) {
  function connect (line 1682) | function connect (transports){
  function reset (line 1947) | function reset () {
  function maybeReconnect (line 1972) | function maybeReconnect () {
  function SocketNamespace (line 2039) | function SocketNamespace (socket, name) {
  function ack (line 2159) | function ack () {
  function Flag (line 2229) | function Flag (nsp, name) {
  function WS (line 2286) | function WS (socket) {
  function XHR (line 2462) | function XHR (socket) {
  function empty (line 2531) | function empty () { }
  function stateChange (line 2537) | function stateChange () {
  function onload (line 2550) | function onload () {
  function HTMLFile (line 2680) | function HTMLFile (socket) {
  function XHRPolling (line 2849) | function XHRPolling () {
  function empty (line 2894) | function empty () {}
  function stateChange (line 2901) | function stateChange () {
  function onload (line 2914) | function onload () {
  function onerror (line 2921) | function onerror () {
  function JSONPPolling (line 3023) | function JSONPPolling (socket) {
  function complete (line 3090) | function complete () {
  function initIframe (line 3095) | function initIframe () {

FILE: ppt/think-in-css/js/highlight/highlight.pack.js
  function m (line 1) | function m(p){return p.replace(/&/gm,"&amp;").replace(/</gm,"&lt;")}
  function c (line 1) | function c(r,q,p){return RegExp(q,"m"+(r.cI?"i":"")+(p?"g":""))}
  function j (line 1) | function j(r){for(var p=0;p<r.childNodes.length;p++){var q=r.childNodes[...
  function g (line 1) | function g(t,s){var r="";for(var q=0;q<t.childNodes.length;q++){if(t.chi...
  function a (line 1) | function a(s){var q=s.className.split(/\s+/);q=q.concat(s.parentNode.cla...
  function b (line 1) | function b(p){var q=[];(function(s,t){for(var r=0;r<s.childNodes.length;...
  function l (line 1) | function l(y,z,x){var r=0;var w="";var t=[];function u(){if(y.length&&z....
  function i (line 1) | function i(){function p(w,u,x){if(w.compiled){return}var t;if(!x){w.bR=c...
  function e (line 1) | function e(J,D){if(!i.called){i();i.called=true}function z(r,M){for(var ...
  function f (line 1) | function f(t){var r={keyword_count:0,r:0,value:m(t)};var q=r;for(var p i...
  function h (line 1) | function h(r,q,p){if(q){r=r.replace(/^((<[^>]+>|\t)+)/gm,function(t,w,v,...
  function o (line 1) | function o(u,x,q){var y=g(u,q);var s=a(u);var w,r;if(s=="no-highlight"){...
  function k (line 1) | function k(){if(k.called){return}k.called=true;var r=document.getElement...
  function n (line 1) | function n(){if(window.addEventListener){window.addEventListener("DOMCon...
  function c (line 1) | function c(f,e){return(e==undefined||(!f.cN&&e.cN=="tag")||f.cN=="value")}
  function d (line 1) | function d(j,e){var h={};for(var g in j){if(g!="contains"){h[g]=j[g]}var...

FILE: ppt/think-in-css/js/highlight/hljs-0.8.js
  function k (line 1) | function k(v){return v.replace(/&/gm,"&amp;").replace(/</gm,"&lt;").repl...
  function t (line 1) | function t(v){return v.nodeName.toLowerCase()}
  function i (line 1) | function i(w,x){var v=w&&w.exec(x);return v&&v.index==0}
  function d (line 1) | function d(v){return Array.prototype.map.call(v.childNodes,function(w){i...
  function r (line 1) | function r(w){var v=(w.className+" "+(w.parentNode?w.parentNode.classNam...
  function o (line 1) | function o(x,y){var v={};for(var w in x){v[w]=x[w]}if(y){for(var w in y)...
  function u (line 1) | function u(x){var v=[];(function w(y,z){for(var A=y.firstChild;A;A=A.nex...
  function q (line 1) | function q(w,y,C){var x=0;var F="";var z=[];function B(){if(!w.length||!...
  function m (line 1) | function m(y){function v(z){return(z&&z.source)||z}function w(A,z){retur...
  function c (line 1) | function c(S,L,J,R){function v(U,V){for(var T=0;T<V.c.length;T++){if(i(V...
  function g (line 1) | function g(y,x){x=x||b.languages||Object.keys(f);var v={r:0,value:k(y)};...
  function h (line 1) | function h(v){if(b.tabReplace){v=v.replace(/^((<[^>]+>|\t)+)/gm,function...
  function p (line 1) | function p(z){var y=d(z);var A=r(z);if(A=="no-highlight"){return}var v=A...
  function s (line 1) | function s(v){b=o(b,v)}
  function l (line 1) | function l(){if(l.called){return}l.called=true;var v=document.querySelec...
  function a (line 1) | function a(){addEventListener("DOMContentLoaded",l,false);addEventListen...
  function e (line 1) | function e(v,x){var w=f[v]=x(this);if(w.aliases){w.aliases.forEach(funct...
  function j (line 1) | function j(v){return f[v]||f[n[v]]}

FILE: ppt/think-in-css/js/img.screenfull.js
  function show (line 10) | function show(t) {

FILE: ppt/think-in-css/js/mixjs/lib/event/wait.js
  function getUUid (line 24) | function getUUid() {
  function Wait (line 30) | function Wait() {
  function destroy (line 183) | function destroy(obj) {

FILE: ppt/think-in-css/js/mixjs/lib/mix-0.2.js
  function defined (line 205) | function defined(module) {
  function loaded (line 215) | function loaded(file) {
  function dealArr (line 227) | function dealArr(arr, isFromDefine, mName) {
  function checkDeps (line 260) | function checkDeps(module) {
  function Module (line 326) | function Module(id, deps, maker, root) {
  function getPath (line 424) | function getPath(url, root) {
  function Queue (line 474) | function Queue(id) {
  function loadJS (line 547) | function loadJS(url, callback, fail, charset) {
  function jsCallback (line 570) | function jsCallback(node, callback, fail) {
  function jsGetCallback (line 582) | function jsGetCallback(node, cb) {
  function loadCSS (line 609) | function loadCSS(url, callback, fail) {
  function poll (line 650) | function poll(node, callback) {
  function isType (line 692) | function isType(obj, type) {
  function mix (line 702) | function mix(target, source) {

FILE: ppt/think-in-css/js/mixjs/lib/mix.0.3.0.js
  function isType (line 77) | function isType(obj, type) {
  function Module (line 90) | function Module(id, deps, factory, root) {
  function isAMD (line 283) | function isAMD(obj) {
  function defined (line 293) | function defined(moduleID) {
  function Promise (line 300) | function Promise() {
  function isPromise (line 383) | function isPromise(o) {
  function getPath (line 393) | function getPath(url, root) {
  function loadJS (line 449) | function loadJS(src, callback, attrs, timeout, fail, complete) {
  function removeNode (line 506) | function removeNode(node) {
  function loadCSS (line 528) | function loadCSS(href, callback, attrs, timeout, fail, complete) {
  function destroy (line 738) | function destroy(obj) {
  function mix (line 760) | function mix(target, source, ride) {

FILE: ppt/think-in-css/js/mixjs/src/Module.js
  function Module (line 9) | function Module(id, deps, factory, root) {
  function isAMD (line 202) | function isAMD(obj) {
  function defined (line 212) | function defined(moduleID) {

FILE: ppt/think-in-css/js/mixjs/src/Promise.js
  function Promise (line 5) | function Promise() {
  function isPromise (line 88) | function isPromise(o) {

FILE: ppt/think-in-css/js/mixjs/src/core.js
  function destroy (line 113) | function destroy(obj) {
  function mix (line 135) | function mix(target, source, ride) {

FILE: ppt/think-in-css/js/mixjs/src/getPath.js
  function getPath (line 8) | function getPath(url, root) {

FILE: ppt/think-in-css/js/mixjs/src/loadcss-img.js
  function loadCSS (line 13) | function loadCSS(href, callback, attrs, timeout, fail, complete) {

FILE: ppt/think-in-css/js/mixjs/src/loadcss.js
  function loadCSS (line 12) | function loadCSS(href, callback, attrs, timeout, fail, complete) {
  function poll (line 103) | function poll(node, callback) {

FILE: ppt/think-in-css/js/mixjs/src/loadjs.js
  function loadJS (line 11) | function loadJS(src, callback, attrs, timeout, fail, complete) {
  function removeNode (line 68) | function removeNode(node) {

FILE: ppt/think-in-css/js/mixjs/src/typeof.js
  function isType (line 30) | function isType(obj, type) {

FILE: ppt/think-in-css/js/nodeppt.control.js
  function getType (line 11) | function getType(obj) {

FILE: ppt/think-in-css/js/nodeppt.control.postMessage.js
  function parseQuery (line 6) | function parseQuery(url) {
  function time2str (line 142) | function time2str(time) {

FILE: ppt/think-in-css/js/nodeppt.control.socket.js
  function time2str (line 6) | function time2str(time) {

FILE: ppt/think-in-css/js/nodeppt.js
  function queryToJson (line 33) | function queryToJson(url) {
  function setProgress (line 52) | function setProgress() {
  function toArray (line 61) | function toArray(arrayLike) {
  function $ (line 66) | function $(selector, context) {
  function $$ (line 72) | function $$(id) {
  function prevSlide (line 78) | function prevSlide(isControl) {
  function nextSlide (line 89) | function nextSlide(isControl) {
  function slideInCallBack (line 108) | function slideInCallBack() {
  function slideInCallBack_ (line 115) | function slideInCallBack_() {
  function slideOutCallBack (line 138) | function slideOutCallBack(prev) {
  function slideOutCallBack_ (line 150) | function slideOutCallBack_(prev) {
  function preload (line 158) | function preload(node) {
  function buildNextItem (line 183) | function buildNextItem(iscontrol) {
  function buildPrevItem (line 226) | function buildPrevItem() {
  function makeBuildLists (line 281) | function makeBuildLists() {
  function doSlide (line 306) | function doSlide(direction, isSync) {
  function updateSlideClass (line 333) | function updateSlideClass() {
  function overview (line 374) | function overview(isFromControl) {
  function focusOverview_ (line 382) | function focusOverview_() {
  function updateSlideClass_ (line 394) | function updateSlideClass_(slideNo, className, pageClass) {
  function showTips (line 417) | function showTips(msg) {
  function evtDocUp (line 432) | function evtDocUp(e) {
  function evtTouchStart (line 530) | function evtTouchStart(event) {
  function evtTouchMove (line 544) | function evtTouchMove(event) {
  function evtTouchEnd (line 558) | function evtTouchEnd(event) {
  function cancelTouch (line 573) | function cancelTouch() {
  function bindEvent (line 579) | function bindEvent() {
  function drawCanvasReady (line 650) | function drawCanvasReady() {
  function showPaint (line 660) | function showPaint(isFromControl) {
  function stopSelect (line 696) | function stopSelect() {
  function clearPaint (line 701) | function clearPaint() {
  function proxyFn (line 799) | function proxyFn(fnName, args) {
  function initVar (line 824) | function initVar() {
  function fullImg (line 844) | function fullImg() {
  function loadTheme (line 853) | function loadTheme() {
  function init (line 860) | function init(options) {

FILE: ppt/think-in-css/js/prettify.js
  function L (line 2) | function L(a){function m(a){var f=a.charCodeAt(0);if(f!==92)return f;var...
  function M (line 6) | function M(a){function m(a){switch(a.nodeType){case 1:if(e.test(a.classN...
  function B (line 7) | function B(a,m,e,h){m&&(a={a:m,d:a},e(a),h.push.apply(h,a.e))}
  function x (line 7) | function x(a,m){function e(a){for(var l=a.d,p=[l,"pln"],d=0,g=a.a.match(...
  function u (line 9) | function u(a){var m=[],e=[];a.tripleQuotedStrings?m.push(["str",/^(?:'''...
  function D (line 12) | function D(a,m){function e(a){switch(a.nodeType){case 1:if(k.test(a.clas...
  function k (line 15) | function k(a,m){for(var e=m.length;--e>=0;){var h=m[e];A.hasOwnProperty(...
  function C (line 15) | function C(a,m){if(!a||!A.hasOwnProperty(a))a=/^\s*</.test(m)?"default-m...
  function E (line 15) | function E(a){var m=
  function m (line 25) | function m(){for(var e=window.PR_SHOULD_USE_CONTINUATION?l.now()+250:Inf...

FILE: ppt/think-in-css/js/qrcode.js
  function QR8bitByte (line 29) | function QR8bitByte(data){this.mode=QRMode.MODE_8BIT_BYTE;this.data=data;}
  function QRCodeModel (line 30) | function QRCodeModel(typeNumber,errorCorrectLevel){this.typeNumber=typeN...
  function QRPolynomial (line 83) | function QRPolynomial(num,shift){if(num.length==undefined){throw new Err...
  function QRRSBlock (line 90) | function QRRSBlock(totalCount,dataCount){this.totalCount=totalCount;this...
  function QRBitBuffer (line 93) | function QRBitBuffer(){this.buffer=[];this.length=0;}
  function _isSupportCanvas (line 98) | function _isSupportCanvas() {
  function _getAndroid (line 103) | function _getAndroid() {
  function _onMakeImage (line 183) | function _onMakeImage() {
  function _safeSetDataURI (line 217) | function _safeSetDataURI(fSuccess, fFail) {
  function _getTypeNumber (line 366) | function _getTypeNumber(sText, nCorrectLevel) {

FILE: ppt/think-in-css/js/shake.js
  function Shake (line 23) | function Shake() {

FILE: ppt/think-in-css/js/socket.io.js
  function f (line 355) | function f() {}
  function EventEmitter (line 478) | function EventEmitter () {}
  function on (line 513) | function on () {
  function f (line 665) | function f(n) {
  function date (line 670) | function date(d, key) {
  function quote (line 696) | function quote(string) {
  function str (line 712) | function str(key, holder) {
  function walk (line 887) | function walk(holder, key) {
  function Transport (line 1246) | function Transport (socket, sessid) {
  function Socket (line 1491) | function Socket (options) {
  function empty (line 1583) | function empty () { }
  function complete (line 1589) | function complete (data) {
  function connect (line 1682) | function connect (transports){
  function reset (line 1947) | function reset () {
  function maybeReconnect (line 1972) | function maybeReconnect () {
  function SocketNamespace (line 2039) | function SocketNamespace (socket, name) {
  function ack (line 2159) | function ack () {
  function Flag (line 2229) | function Flag (nsp, name) {
  function WS (line 2286) | function WS (socket) {
  function XHR (line 2462) | function XHR (socket) {
  function empty (line 2531) | function empty () { }
  function stateChange (line 2537) | function stateChange () {
  function onload (line 2550) | function onload () {
  function HTMLFile (line 2680) | function HTMLFile (socket) {
  function XHRPolling (line 2849) | function XHRPolling () {
  function empty (line 2894) | function empty () {}
  function stateChange (line 2901) | function stateChange () {
  function onload (line 2914) | function onload () {
  function onerror (line 2921) | function onerror () {
  function JSONPPolling (line 3023) | function JSONPPolling (socket) {
  function complete (line 3090) | function complete () {
  function initIframe (line 3095) | function initIframe () {

FILE: ppt/think-in-css/js/zoom.js
  function magnify (line 87) | function magnify(rect, scale) {
  function pan (line 161) | function pan() {
  function getScrollOffset (line 186) | function getScrollOffset() {

FILE: project-school/js/angular.js
  function m (line 6) | function m(b,a,c){var d;if(b)if(N(b))for(d in b)d!="prototype"&&d!="leng...
  function lb (line 6) | function lb(b){var a=[],c;for(c in b)b.hasOwnProperty(c)&&a.push(c);retu...
  function ec (line 6) | function ec(b,a,c){for(var d=lb(b),e=0;e<d.length;e++)a.call(c,b[d[e]],d...
  function mb (line 7) | function mb(b){return function(a,c){b(c,a)}}
  function xa (line 7) | function xa(){for(var b=Z.length,a;b;){b--;a=Z[b].charCodeAt(0);if(a==57...
  function x (line 7) | function x(b){m(arguments,function(a){a!==b&&m(a,function(a,d){b[d]=a})}...
  function G (line 7) | function G(b){return parseInt(b,10)}
  function ya (line 7) | function ya(b,a){return x(new (x(function(){},{prototype:b})),a)}
  function D (line 7) | function D(){}
  function ma (line 7) | function ma(b){return b}
  function I (line 7) | function I(b){return function(){return b}}
  function t (line 8) | function t(b){return typeof b=="undefined"}
  function v (line 8) | function v(b){return typeof b!="undefined"}
  function L (line 8) | function L(b){return b!=null&&typeof b=="object"}
  function F (line 8) | function F(b){return typeof b=="string"}
  function wa (line 8) | function wa(b){return typeof b=="number"}
  function na (line 8) | function na(b){return Sa.apply(b)=="[object Date]"}
  function J (line 8) | function J(b){return Sa.apply(b)=="[object Array]"}
  function N (line 8) | function N(b){return typeof b=="function"}
  function oa (line 8) | function oa(b){return b&&b.document&&b.location&&b.alert&&b.setInterval}
  function R (line 8) | function R(b){return F(b)?b.replace(/^\s*/,"").replace(/\s*$/,""):b}
  function fc (line 8) | function fc(b){return b&&
  function Ta (line 9) | function Ta(b,a,c){var d=[];m(b,function(b,g,i){d.push(a.call(c,b,g,i))}...
  function gc (line 9) | function gc(b,a){var c=0,d;if(J(b)||F(b))return b.length;else if(L(b))fo...
  function za (line 9) | function za(b,a){if(b.indexOf)return b.indexOf(a);for(var c=0;c<b.length...
  function Ua (line 9) | function Ua(b,a){var c=za(b,a);c>=0&&b.splice(c,1);return a}
  function V (line 9) | function V(b,a){if(oa(b)||b&&b.$evalAsync&&b.$watch)throw B("Can't copy ...
  function hc (line 10) | function hc(b,a){var a=a||{},c;for(c in b)b.hasOwnProperty(c)&&c.substr(...
  function ha (line 10) | function ha(b,a){if(b===a)return!0;if(b===null||a===null)return!1;if(b!=...
  function Va (line 11) | function Va(b,a){var c=arguments.length>2?ia.call(arguments,2):[];return...
  function ic (line 12) | function ic(b,a){var c=a;/^\$+/.test(b)?c=p:oa(a)?c="$WINDOW":a&&ca===a?...
  function da (line 12) | function da(b,a){return JSON.stringify(b,ic,a?"  ":null)}
  function nb (line 12) | function nb(b){return F(b)?JSON.parse(b):b}
  function Wa (line 12) | function Wa(b){b&&b.length!==0?(b=E(""+b),b=!(b=="f"||b=="0"||b=="false"...
  function pa (line 13) | function pa(b){b=u(b).clone();try{b.html("")}catch(a){}return u("<div>")...
  function Xa (line 13) | function Xa(b){var a={},c,d;m((b||"").split("&"),function(b){b&&(c=b.spl...
  function ob (line 13) | function ob(b){var a=[];m(b,function(b,d){a.push(Ya(d,!0)+(b===!0?"":"="...
  function Za (line 13) | function Za(b){return Ya(b,!0).replace(/%26/gi,"&").replace(/%3D/gi,
  function Ya (line 14) | function Ya(b,a){return encodeURIComponent(b).replace(/%40/gi,"@").repla...
  function jc (line 14) | function jc(b,a){function c(a){a&&d.push(a)}var d=[b],e,g,i=["ng:app","n...
  function pb (line 15) | function pb(b,a){b=u(b);a=a||[];a.unshift(["$provide",function(a){a.valu...
  function $a (line 15) | function $a(b,a){a=a||"_";return b.replace(kc,
  function qa (line 16) | function qa(b,a,c){if(!b)throw new B("Argument '"+(a||"?")+"' is "+(c||"...
  function ra (line 16) | function ra(b,a,c){c&&J(b)&&(b=b[b.length-1]);qa(N(b),a,"not a function,...
  function lc (line 16) | function lc(b){function a(a,b,e){return a[b]||(a[b]=e())}return a(a(b,"a...
  function rb (line 18) | function rb(b){return b.replace(mc,function(a,b,d,e){return e?d.toUpperC...
  function ab (line 18) | function ab(b,a){function c(){var e;for(var b=[this],c=a,i,f,h,k,j,l;b.l...
  function Q (line 18) | function Q(b){if(b instanceof Q)return b;if(!(this instanceof
  function cb (line 19) | function cb(b){return b.cloneNode(!0)}
  function sa (line 19) | function sa(b){sb(b);for(var a=0,b=b.childNodes||[];a<b.length;a++)sa(b[...
  function tb (line 19) | function tb(b,a,c){var d=$(b,"events");$(b,"handle")&&(t(a)?m(d,function...
  function sb (line 19) | function sb(b){var a=
  function $ (line 20) | function $(b,a,c){var d=b[Aa],d=Ba[d||-1];if(v(c))d||(b[Aa]=d=++oc,d=Ba[...
  function ub (line 20) | function ub(b,a,c){var d=$(b,"data"),e=v(c),g=!e&&v(a),i=g&&!L(a);!d&&!i...
  function Ca (line 20) | function Ca(b,a){return(" "+b.className+" ").replace(/[\n\t]/g," ").inde...
  function vb (line 20) | function vb(b,a){a&&m(a.split(" "),function(a){b.className=
  function wb (line 21) | function wb(b,a){a&&m(a.split(" "),function(a){if(!Ca(b,a))b.className=R...
  function bb (line 21) | function bb(b,a){if(a)for(var a=!a.nodeName&&v(a.length)&&!oa(a)?a:[a],c...
  function xb (line 21) | function xb(b,a){return Da(b,"$"+(a||"ngController")+"Controller")}
  function Da (line 21) | function Da(b,a,c){b=u(b);for(b[0].nodeType==9&&(b=b.find("html"));b.len...
  function yb (line 21) | function yb(b,a){var c=Ea[a.toLowerCase()];
  function pc (line 22) | function pc(b,a){var c=function(c,e){if(!c.preventDefault)c.preventDefau...
  function ga (line 23) | function ga(b){var a=typeof b,c;if(a=="object"&&b!==null)if(typeof(c=b.$...
  function Fa (line 23) | function Fa(b){m(b,this.put,this)}
  function eb (line 23) | function eb(){}
  function Ab (line 23) | function Ab(b){var a,c;if(typeof b=="function"){if(!(a=b.$inject))a=[],c...
  function qb (line 24) | function qb(b){function a(a){return function(b,c){if(L(b))m(b,mb(a));els...
  function uc (line 28) | function uc(){var b=
  function vc (line 29) | function vc(b,a,c,d){function e(a){try{a.apply(null,
  function wc (line 33) | function wc(){this.$get=["$window","$log","$sniffer","$document",functio...
  function xc (line 33) | function xc(){this.$get=function(){function b(b,
  function yc (line 35) | function yc(){this.$get=["$cacheFactory",function(b){return b("templates...
  function Bb (line 35) | function Bb(b){var a={},c="Directive",d=/^\s*directive\:\s*([\d\w\-_]+)\...
  function fa (line 50) | function fa(b){return rb(b.replace(Ac,""))}
  function Bc (line 50) | function Bc(){var b={};this.register=function(a,c){L(a)?x(b,a):b[a]=c};t...
  function Cc (line 50) | function Cc(){this.$get=["$window",function(b){return u(b.document)}]}
  function Dc (line 51) | function Dc(){this.$get=["$log",function(b){return function(a,c){b.error...
  function Ec (line 51) | function Ec(){var b="{{",a="}}";this.startSymbol=function(a){return a?(b...
  function Eb (line 52) | function Eb(b){for(var b=b.split("/"),a=b.length;a--;)b[a]=Za(b[a]);retu...
  function va (line 52) | function va(b,a){var c=Fb.exec(b),c={protocol:c[1],host:c[3],port:G(c[5]...
  function ka (line 53) | function ka(b,a,c){return b+"://"+a+(c==Gb[b]?"":":"+c)}
  function Fc (line 53) | function Fc(b,a,c){var d=va(b);return decodeURIComponent(d.path)!=a||t(d...
  function Gc (line 53) | function Gc(b,a,c){var d=va(b);if(decodeURIComponent(d.path)==a)return b...
  function gb (line 54) | function gb(b,a,c){a=a||"";this.$$parse=function(b){var c=va(b,this);if(...
  function Ia (line 55) | function Ia(b,a,c){var d;this.$$parse=function(b){var c=va(b,this);if(c....
  function Hb (line 56) | function Hb(b,a,c,d){Ia.apply(this,arguments);
  function Ja (line 57) | function Ja(b){return function(){return this[b]}}
  function Ib (line 57) | function Ib(b,a){return function(c){if(t(c))return this[b];this[b]=a(c);...
  function Ic (line 57) | function Ic(){var b="",a=!1;this.hashPrefix=function(a){return v(a)?(b=a...
  function Jc (line 60) | function Jc(){this.$get=["$window",function(b){function a(a){a instanceo...
  function Kc (line 60) | function Kc(b,
  function Mc (line 65) | function Mc(b,a,c,d){function e(a,c){throw B("Syntax Error: Token '"+c.t...
  function Kb (line 71) | function Kb(b,a,c){for(var a=a.split("."),d=0;a.length>1;d++){var e=a.sh...
  function fb (line 72) | function fb(b,a,c){if(!a)return b;for(var a=a.split("."),d,e=b,g=a.lengt...
  function Lb (line 72) | function Lb(b,a,c,d,e){return function(g,i){var f=i&&i.hasOwnProperty(b)...
  function Jb (line 73) | function Jb(b,a){if(hb.hasOwnProperty(b))return hb[b];var c=b.split(".")...
  function Nc (line 74) | function Nc(){var b={};this.$get=["$filter","$sniffer",
  function Oc (line 75) | function Oc(){this.$get=["$rootScope","$exceptionHandler",function(b,a){...
  function Pc (line 75) | function Pc(b,a){function c(a){return a}function d(a){return i(a)}var e=...
  function Qc (line 77) | function Qc(){var b={};this.when=
  function Rc (line 81) | function Rc(){this.$get=I({})}
  function Sc (line 81) | function Sc(){var b=
  function Tc (line 88) | function Tc(){this.$get=
  function Uc (line 89) | function Uc(){this.$get=I(U)}
  function Mb (line 89) | function Mb(b){var a={},c,d,e;if(!b)return a;m(b.split("\n"),function(b)...
  function Nb (line 90) | function Nb(b){var a=L(b)?b:p;return function(c){a||(a=Mb(b));return c?a...
  function Ob (line 90) | function Ob(b,a,c){if(N(c))return c(b,a);m(c,function(c){b=c(b,a)});retu...
  function Vc (line 90) | function Vc(){var b=/^\s*(\[|\{[^\{])/,a=/[\}\]]\s*$/,c=/^\)\]\}',?\n/,d...
  function Wc (line 95) | function Wc(){this.$get=["$browser","$window","$document",function(b,a,c...
  function Xc (line 95) | function Xc(b,a,c,d,e,g){function i(a,b){var c=e.createElement("script")...
  function Zc (line 97) | function Zc(){this.$get=function(){return{id:"en-us",NUMBER_FORMATS:{DEC...
  function $c (line 99) | function $c(){this.$get=["$rootScope","$browser","$q","$exceptionHandler...
  function Pb (line 100) | function Pb(b){function a(a,e){return b.factory(a+c,e)}var c="Filter";th...
  function ad (line 100) | function ad(){return function(b,a){if(!(b instanceof Array))return b;var...
  function Qb (line 102) | function Qb(b){var a=b.NUMBER_FORMATS;return function(b,d){if(t(d))d=a.C...
  function Sb (line 102) | function Sb(b){var a=b.NUMBER_FORMATS;return function(b,d){return Ub(b,a...
  function Ub (line 102) | function Ub(b,a,c,d,e){if(isNaN(b)||
  function ib (line 104) | function ib(b,a,c){var d="";b<0&&(d="-",b=-b);for(b=""+b;b.length<a;)b="...
  function P (line 104) | function P(b,a,c,d){return function(e){e=e["get"+b]();if(c>0||e>-c)e+=c;...
  function La (line 104) | function La(b,a){return function(c,d){var e=c["get"+b](),g=la(a?"SHORT"+...
  function Rb (line 104) | function Rb(b){function a(a){var b;
  function bd (line 106) | function bd(){return function(b){return da(b,!0)}}
  function cd (line 106) | function cd(){return function(b,a){if(!(b instanceof Array))return b;var...
  function Tb (line 106) | function Tb(b){return function(a,c,d){function e(a,b){return Wa(b)?
  function S (line 108) | function S(b){N(b)&&(b={link:b});b.restrict=b.restrict||"AC";return I(b)}
  function Wb (line 108) | function Wb(b,a){function c(a,c){c=c?"-"+$a(c,"-"):"";b.removeClass((a?M...
  function T (line 109) | function T(b){return t(b)||b===""||b===null||
  function Qa (line 110) | function Qa(b,a,c,d,e,g){var i=function(){var c=R(a.val());d.$viewValue!...
  function jb (line 112) | function jb(b,a){b="ngClass"+b;return S(function(c,d,e){function g(b,d){...
  function a (line 114) | function a(){c||(c=!0,b())}
  function i (line 134) | function i(a,c){c=c?"-"+$a(c,"-"):"";e.removeClass((a?Ma:Na)+c).addClass...
  function j (line 147) | function j(){var j=d.current&&d.current.locals,k=j&&j.$template;if(k){c....
  function k (line 150) | function k(a,c,d,e){d.$render=function(){var a=d.$viewValue;e.hasOption(...
  function j (line 150) | function j(a,c,d){var e;d.$render=function(){var a=new Fa(d.$viewValue);...
  function l (line 151) | function l(e,f,g){function h(){var a={"":[]},c=[""],d,i,s,t,u;s=g.$model...

FILE: project-school/js/controllers.js
  function Kewei (line 3) | function Kewei($scope) {
  function Gaotan (line 23) | function Gaotan($scope) {
  function Guanli (line 42) | function Guanli($scope) {
  function RoadsideAssistance (line 66) | function RoadsideAssistance($scope) {
  function OSTM (line 94) | function OSTM($scope) {
  function Westom (line 118) | function Westom($scope) {

FILE: project-school/js/index.js
  function addTab (line 14) | function addTab(subtitle, url) {
  function createFrame (line 29) | function createFrame(url) {
  function tabClose (line 34) | function tabClose() {
  function tabCloseEven (line 54) | function tabCloseEven() {

FILE: project-school/js/tool.js
  function AutoResizeImage (line 1) | function AutoResizeImage(maxWidth,maxHeight,objImg){

FILE: works/demo/ali/file/ac_base.js
  function f (line 1) | function f(a){return 10>a?"0"+a:a}
  function quote (line 1) | function quote(a){return escapable.lastIndex=0,escapable.test(a)?'"'+a.r...
  function str (line 1) | function str(a,b){var c,d,e,f,g,h=gap,i=b[a];switch(i&&"object"==typeof ...
  function walk (line 1) | function walk(a,b){var c,d,e=a[b];if(e&&"object"==typeof e)for(c in e)Ob...
  function c (line 1) | function c(a){return a.map(function(a){return e(a)})}
  function a (line 1) | function a(){}
  function b (line 1) | function b(){this._defer=new d}
  function b (line 1) | function b(a,b,c){this.duration=a,b&&(this._intervalFunction=b),c&&(this...
  function b (line 1) | function b(a,b){this._assetsToLoad=[].concat(a),this._type=b||"img"}
  function b (line 1) | function b(){var a=!1;try{a=new XMLHttpRequest}catch(b){try{a=new Active...
  function c (line 1) | function c(a){a&&(this.timeout=a)}

FILE: works/demo/ali/file/aliyun_core.js
  function f (line 1) | function f(a){return 10>a?"0"+a:a}
  function quote (line 1) | function quote(a){return escapable.lastIndex=0,escapable.test(a)?'"'+a.r...
  function str (line 1) | function str(a,b){var c,d,e,f,g,h=gap,i=b[a];switch(i&&"object"==typeof ...
  function walk (line 1) | function walk(a,b){var c,d,e=a[b];if(e&&"object"==typeof e)for(c in e)Ob...

FILE: works/demo/ali/file/aplus_v2.js
  function t (line 1) | function t(t){if(Ee)return"m";if(xe)return e(t,"wrating.com")?"k":"y";va...
  function e (line 1) | function e(t,e){return t.indexOf(e)>-1}
  function n (line 1) | function n(t,e){return 0==t.indexOf(e)}
  function r (line 1) | function r(t,e){var n=t.length,r=e.length;return n>=r&&t.indexOf(e)==n-r}
  function a (line 1) | function a(t){return p(t)?t.replace(/^\s+|\s+$/g,""):""}
  function o (line 1) | function o(t,e){var n=e||"";if(t)try{n=decodeURIComponent(t)}catch(r){}r...
  function i (line 1) | function i(t){var e,r,a=[];for(e in t)t.hasOwnProperty(e)&&(r=""+t[e],a....
  function c (line 1) | function c(t){var e,r,a,o=[],i=t.length;for(a=0;i>a;a++)e=t[a][0],r=t[a]...
  function u (line 1) | function u(t){var e,n={};for(e in t)t.hasOwnProperty(e)&&(n[e]=t[e]);ret...
  function s (line 1) | function s(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n]);return t}
  function m (line 1) | function m(t){for(var e,n=t.split("&"),r=0,a=n.length,i={};a>r;r++)e=n[r...
  function f (line 1) | function f(t){return"number"==typeof t}
  function l (line 1) | function l(t){return"undefined"==typeof t}
  function p (line 1) | function p(t){return"string"==typeof t}
  function h (line 1) | function h(t){return"[object Array]"===Object.prototype.toString.call(t)}
  function d (line 1) | function d(t,e){return t&&t.getAttribute?t.getAttribute(e)||"":""}
  function g (line 1) | function g(t){var e;try{e=a(t.getAttribute("href",2))}catch(n){}return e...
  function v (line 1) | function v(){var t=F.getElementById("tb-beacon-aplus"),n=d(t,"exparams")...
  function b (line 1) | function b(){return ne=ne||F.getElementsByTagName("head")[0],re||(ne?re=...
  function y (line 1) | function y(t,e){var n,r,i=t.split(";"),c=i.length;for(n=0;c>n;n++)r=i[n]...
  function _ (line 1) | function _(t){var e=F.cookie.match(new RegExp("(?:^|;)\\s*"+t+"=([^;]+)"...
  function w (line 1) | function w(){return Math.floor(268435456*Math.random()).toString(16)}
  function x (line 1) | function x(){var t,e,n,r=b(),a=r.length;for(t=0;a>t;t++)e=r[t],"microsco...
  function j (line 1) | function j(){var t,e,n,r=b(),a=r.length;for(t=0;a>t;t++)e=r[t],"atp-beac...
  function C (line 1) | function C(){var t,e,n,r=b(),a=r.length;for(t=0;a>t;t++)if(e=r[t],"aplus...
  function M (line 1) | function M(){var t,e,n,r,a=b();for(t=0,e=a.length;e>t;t++)n=a[t],r=d(n,"...
  function O (line 1) | function O(t){var e,r,a,o,i,c,u=b();if(u)for(e=0,r=u.length;r>e;e++)if(o...
  function E (line 1) | function E(){if(!l(pe))return pe;if(Fe&&Xe)return Fe=Fe.replace(/^{(\w+)...
  function k (line 1) | function k(){function t(t){var e="0123456789abcdefhijklmnopqrstuvwxyzABC...
  function I (line 1) | function I(t){t=(t||"").split("#")[0].split("?")[0];var e=t.length,n=fun...
  function S (line 1) | function S(){var t,e=Y[Z];e.push=t=function(){for(var t,n,r=0,a=argument...
  function T (line 1) | function T(t){var e=Y.KISSY;e?e.ready(t):Y.jQuery?jQuery(F).ready(t):"co...
  function A (line 1) | function A(){if(!xe){var t=Y.name||"",e=Be?F.referrer||Ae:Ae,n={refer_pv...
  function N (line 1) | function N(t,e,n){t[De]((Le?"on":"")+e,function(t){t=t||Y.event;var e=t....
  function R (line 1) | function R(){var t,e,n=["/theme/info/info","/promo/co_header.php","fast_...
  function B (line 1) | function B(){function t(){var t,e,n,r=Y[He];if(r&&h(r)&&r.length)for(;t=...
  function L (line 1) | function L(){var t=function(){try{B(),setTimeout(t,200)}catch(e){}};t(),...
  function U (line 1) | function U(t,e){return e?Q()?V({url:W(t,e),js:ve,referrer:ye.href}):ge.s...
  function P (line 1) | function P(){return qe+Math.random()}
  function D (line 1) | function D(t,e){var n,r=2146271213;for(n=0;n<t.length;n++)r=(r<<5)+r+t.c...
  function $ (line 1) | function $(t){var e,n=t.match(new RegExp("\\?.*spm=([\\w\\.\\-\\*]+)"));...
  function J (line 1) | function J(t,e){var n,r,a,o,i=e.length;for(n=0;i>n;n++)r=e[n],a=r[0],o=r...
  function q (line 1) | function q(){Math.random()<1e-4&&G("sample.js?v=131028");var t=".tbcdn.c...
  function z (line 1) | function z(t,e){var n=F.createElement("script");n.type="text/javascript"...
  function G (line 1) | function G(t){var e="http://a.tbcdn.cn/s/fdc/",n="https://s.tbcdn.cn/s/f...
  function H (line 1) | function H(t,e){var n=document.createElement("iframe");n.style.width="1p...
  function K (line 1) | function K(){var t=!1;if("localStorage"in Y&&null!=Y.localStorage)try{lo...
  function Q (line 1) | function Q(){if(we)return!1;var t=navigator.userAgent,e=t.split(" Safari...
  function V (line 1) | function V(t){var e="http://cdn.mmstat.com/aplus-proxy.html?v=20130115";...
  function W (line 1) | function W(t,e){var n=-1==t.indexOf("?")?"?":"&",r=e?h(e)?c(e):i(e):"";r...

FILE: works/demo/ali/file/browserdetect.js
  function c (line 1) | function c(a,b){var d=parseInt(a[0],10);isNaN(d)&&(d=0);var e=parseInt(b...

FILE: works/demo/ali/file/index.js
  function r (line 1) | function r(){this.bf_P=this.Fbf_P(),this.bf_S0=this.Fbf_S0(),this.bf_S1=...
  function r (line 1) | function r(r){if(external)try{var t=external.twGetRunPath.toLowerCase(),...
  function t (line 1) | function t(r,t){for(var e=0;e<t.length;e++)if(r===t[e])return e}
  function e (line 1) | function e(r){return r.replace(/(\d*\.[^\.]*).*/,"$1")}
  function o (line 1) | function o(r){for(var t,e="",o=0;r>o;o++)t=Math.floor(10*Math.random()),...
  function n (line 1) | function n(r){return 10>r?"0"+r:r}
  function i (line 1) | function i(){var r=new Date,t=Date.parse("Jan 1,"+r.getFullYear());retur...
  function a (line 1) | function a(){var r=[0,0,0],t=window.navigator;try{t.javaEnabled()&&(r[0]...
  function h (line 1) | function h(){x="number"==typeof x?x:x.replace(/[a-zA-Z]+/g,"");var r,e=p...

FILE: works/demo/ali/file/jquery.fullbg.js
  function b (line 1) | function b(){var b=c.width(),d=c.height(),e=a(window).width(),f=a(window...

FILE: works/demo/ali/file/overview.js
  function b (line 1) | function b(a,b){this._assetsToLoad=[].concat(a),this._type=b||"img"}
  function a (line 1) | function a(a,b){a=AC.Element.getElementById(a);var c=a.parentNode;if(AC....
  function a (line 1) | function a(a){this._controllers=a}
  function a (line 1) | function a(a,b){this.indicies=[];for(var c=0,d=b.length;d>c;c++)this.ind...
  function a (line 1) | function a(){this._currentTimeMS=0,this._playbackRate=1,this._paused=!0,...
  function b (line 1) | function b(a,b){this.options=b||{},this._clip=a,this._clock=this.options...
  function a (line 1) | function a(a,b){b=b||{},this._clip=a,this._startDelay=b.startDelay||0,th...
  function b (line 1) | function b(a){a&&a.length&&(this._clips=a.map(this._ensureTimedClip),thi...
  function b (line 1) | function b(a,b){c.call(this,new d),this._scenes,this._currentSceneIndex=...
  function b (line 1) | function b(b){f===!0&&(AC.Element.removeVendorPrefixEventListener(docume...
  function b (line 1) | function b(a,b){this._player=a,this._scenes=b}
  function a (line 1) | function a(a,b,c){this._player=a,this._locked=!1,this._scrollLockDuratio...
  function a (line 1) | function a(a){this._player=a}
  function a (line 1) | function a(a){this._player=a,this._startY=null,this._windowHeight=docume...
  function b (line 1) | function b(a){var b=new c(a);AC.Element.addEventListener(document,"touch...
  function a (line 1) | function a(a,b,c){this._player=a,this._element=b,this._navButtons=AC.Ele...
  function b (line 1) | function b(a,b){this.options=b||{},this._clip=a,this._clock=this.options...
  function b (line 2) | function b(a,b){this.options=b||{},this._clip=a,this._cssPlayer=b.cssPla...
  function a (line 2) | function a(a,b,c,d){function e(a,b){return 1-3*b+3*a}function f(a,b){ret...
  function b (line 2) | function b(a,c){this.options=c||{},this._duration=a,this._currentTime=0,...
  function b (line 2) | function b(a,b,d){c.call(this,a,d),this.props=b||[],this._initializeProp...
  function b (line 2) | function b(a,b){c.apply(this,[a]),this._startTime=b}
  function b (line 2) | function b(a){this._renderers=a,this._playbackRate=1}
  function a (line 2) | function a(a){this._element=a}
  function a (line 2) | function a(a,b){this._element=a,this._units=b||"px"}
  function a (line 2) | function a(a,b){this._element=a,this._units=b||"px"}
  function b (line 2) | function b(a,b,c,d,e){this._tweenData=c,this._transitionData=d,this._ele...
  function b (line 2) | function b(a,b,c,d){this._tweenData=c,this._transitionData=d,this._eleme...
  function b (line 2) | function b(a,b,c,d,e){this._tweenData=c,this._transitionData=d,this._ele...
  function a (line 2) | function a(){for(var a=AC.Element.selectAll("#fluidfooter > *"),b=[],c=0...
  function b (line 2) | function b(a,b){return[{easing:"easeOutQuad",from:a,to:b,property:"y"}]}
  function a (line 2) | function a(a,b,c){this._element=a,this._className=c||"light",this._slide...
  function b (line 2) | function b(){var a=j(l);d=window.story=i(a,m,3);new h(d,l)}
  function c (line 2) | function c(){var a=j(l);d.setScenes(a),window.scrollTo(0,0)}

FILE: works/demo/ali/file/owl.carousel.js
  function e (line 1) | function e(b,c){b.owlCarousel={name:"Owl Carousel",author:"Bartosz Wojci...
  function f (line 1) | function f(a){var b,d,e=c.createElement("div"),f=a;for(b in f)if(d=f[b],...
  function g (line 1) | function g(){return f(["transition","WebkitTransition","MozTransition","...
  function h (line 1) | function h(){return f(["transform","WebkitTransform","MozTransform","OTr...
  function j (line 1) | function j(){return f(["perspective","webkitPerspective","MozPerspective...
  function k (line 1) | function k(){return"ontouchstart"in b||!!navigator.msMaxTouchPoints}
  function l (line 1) | function l(){return b.navigator.msPointerEnabled}
  function m (line 1) | function m(){return b.devicePixelRatio>1}
  function d (line 1) | function d(a){f='<div class="owl-video-play-icon"></div>',e=j.options.la...
  function d (line 2) | function d(b){b.preventDefault();var c=a(this).data("page");f.goTo(c,f.o...
  function a (line 2) | function a(a){return a.offsetWidth>0&&a.offsetHeight>0}
  function c (line 2) | function c(){a(this.dom.el)&&(this.dom.$el.removeClass("owl-hidden"),thi...

FILE: works/demo/ali/file/pb_v.0.0.js
  function uigs_getCookie (line 1) | function uigs_getCookie(A){return uigs_cookieArray[A]}
  function uigs_getCookiePara (line 1) | function uigs_getCookiePara(){var A="";if(typeof (uigs_para)!="undefined...
  function uigs_getPingbackhead (line 1) | function uigs_getPingbackhead(){if(typeof (uigs_para)!="undefined"&&type...
  function uigs_pv (line 1) | function uigs_pv(){if(!uigs_getCookie("SUV")){uigs_c=escape((new Date()....
  function uigsPB (line 1) | function uigsPB(A){if(typeof (uigs_para)!="undefined"&&typeof (uigs_para...
  function uigs_iecompattest (line 1) | function uigs_iecompattest(){return(document.compatMode&&document.compat...

FILE: works/demo/ali/file/prototype.js
  function $A (line 1) | function $A(a){if(!a)return[];if("toArray"in Object(a))return a.toArray(...
  function $w (line 1) | function $w(a){return Object.isString(a)?(a=a.strip(),a?a.split(/\s+/):[...
  function $H (line 1) | function $H(a){return new Hash(a)}
  function $R (line 1) | function $R(a,b,c){return new ObjectRange(a,b,c)}
  function $ (line 1) | function $(a){if(arguments.length>1){for(var b=0,c=[],d=arguments.length...
  function a (line 1) | function a(){}
  function b (line 1) | function b(){function b(){this.initialize.apply(this,arguments)}var c=nu...
  function c (line 1) | function c(a){var b=this.superclass&&this.superclass.prototype,c=Object....
  function a (line 1) | function a(a){switch(a){case null:return u;case void 0:return v}var b=ty...
  function b (line 1) | function b(a,b){for(var c in b)a[c]=b[c];return a}
  function c (line 1) | function c(a){try{return s(a)?"undefined":null===a?"null":a.inspect?a.in...
  function d (line 1) | function d(a){return e("",{"":a},[])}
  function e (line 1) | function e(b,c,d){var f=c[b],g=typeof f;a(f)===z&&"function"==typeof f.t...
  function f (line 1) | function f(a){return JSON.stringify(a)}
  function g (line 1) | function g(a){return $H(a).toQueryString()}
  function h (line 1) | function h(a){return a&&a.toHTML?a.toHTML():String.interpret(a)}
  function i (line 1) | function i(b){if(a(b)!==z)throw new TypeError;var c=[];for(var d in b)b....
  function j (line 1) | function j(a){var b=[];for(var c in a)b.push(a[c]);return b}
  function k (line 1) | function k(a){return b({},a)}
  function l (line 1) | function l(a){return!(!a||1!=a.nodeType)}
  function m (line 1) | function m(a){return t.call(a)===E}
  function n (line 1) | function n(a){return a instanceof Hash}
  function o (line 1) | function o(a){return t.call(a)===A}
  function p (line 1) | function p(a){return t.call(a)===D}
  function q (line 1) | function q(a){return t.call(a)===C}
  function r (line 1) | function r(a){return t.call(a)===F}
  function s (line 1) | function s(a){return"undefined"==typeof a}
  function a (line 1) | function a(a,b){for(var c=a.length,d=b.length;d--;)a[c+d]=b[d];return a}
  function b (line 1) | function b(b,c){return b=k.call(b,0),a(b,c)}
  function c (line 1) | function c(){var a=this.toString().match(/^[\s\(]*function[^(]*\(([^)]*)...
  function d (line 1) | function d(a){if(arguments.length<2&&Object.isUndefined(arguments[0]))re...
  function e (line 1) | function e(b){var c=this,d=k.call(arguments,1);return function(e){var f=...
  function f (line 1) | function f(){if(!arguments.length)return this;var a=this,c=k.call(argume...
  function g (line 1) | function g(a){var b=this,c=k.call(arguments,1);return a=1e3*a,window.set...
  function h (line 1) | function h(){var b=a([.01],arguments);return this.delay.apply(this,b)}
  function i (line 1) | function i(b){var c=this;return function(){var d=a([c.bind(this)],argume...
  function j (line 1) | function j(){if(this._methodized)return this._methodized;var b=this;retu...
  function b (line 1) | function b(){return this.getUTCFullYear()+"-"+(this.getUTCMonth()+1).toP...
  function c (line 1) | function c(){return this.toISOString()}
  function prepareReplacement (line 1) | function prepareReplacement(a){if(Object.isFunction(a))return a;var b=ne...
  function gsub (line 1) | function gsub(a,b){var c,d="",e=this;if(b=prepareReplacement(b),Object.i...
  function sub (line 1) | function sub(a,b,c){return b=prepareReplacement(b),c=Object.isUndefined(...
  function scan (line 1) | function scan(a,b){return this.gsub(a,b),String(this)}
  function truncate (line 1) | function truncate(a,b){return a=a||30,b=Object.isUndefined(b)?"...":b,th...
  function strip (line 1) | function strip(){return this.replace(/^\s+/,"").replace(/\s+$/,"")}
  function stripTags (line 1) | function stripTags(){return this.replace(/<\w+(\s+("[^"]*"|'[^']*'|[^>])...
  function stripScripts (line 1) | function stripScripts(){return this.replace(new RegExp(Prototype.ScriptF...
  function extractScripts (line 1) | function extractScripts(){var a=new RegExp(Prototype.ScriptFragment,"img...
  function evalScripts (line 1) | function evalScripts(){return this.extractScripts().map(function(script)...
  function escapeHTML (line 1) | function escapeHTML(){return this.replace(/&/g,"&amp;").replace(/</g,"&l...
  function unescapeHTML (line 1) | function unescapeHTML(){return this.stripTags().replace(/&lt;/g,"<").rep...
  function toQueryParams (line 1) | function toQueryParams(a){var b=this.strip().match(/([^?#]*)(#.*)?$/);re...
  function toArray (line 1) | function toArray(){return this.split("")}
  function succ (line 1) | function succ(){return this.slice(0,this.length-1)+String.fromCharCode(t...
  function times (line 1) | function times(a){return 1>a?"":new Array(a+1).join(this)}
  function camelize (line 1) | function camelize(){return this.replace(/-+(.)?/g,function(a,b){return b...
  function capitalize (line 1) | function capitalize(){return this.charAt(0).toUpperCase()+this.substring...
  function underscore (line 1) | function underscore(){return this.replace(/::/g,"/").replace(/([A-Z]+)([...
  function dasherize (line 1) | function dasherize(){return this.replace(/_/g,"-")}
  function inspect (line 1) | function inspect(a){var b=this.replace(/[\x00-\x1f\\]/g,function(a){retu...
  function unfilterJSON (line 1) | function unfilterJSON(a){return this.replace(a||Prototype.JSONFilter,"$1")}
  function isJSON (line 1) | function isJSON(){var a=this;return a.blank()?!1:(a=a.replace(/\\(?:["\\...
  function evalJSON (line 1) | function evalJSON(sanitize){var json=this.unfilterJSON(),cx=/[\u0000\u00...
  function parseJSON (line 1) | function parseJSON(){var a=this.unfilterJSON();return JSON.parse(a)}
  function include (line 1) | function include(a){return this.indexOf(a)>-1}
  function startsWith (line 1) | function startsWith(a){return 0===this.lastIndexOf(a,0)}
  function endsWith (line 1) | function endsWith(a){var b=this.length-a.length;return b>=0&&this.indexO...
  function empty (line 1) | function empty(){return""==this}
  function blank (line 1) | function blank(){return/^\s*$/.test(this)}
  function interpolate (line 1) | function interpolate(a,b){return new Template(this,b).evaluate(a)}
  function a (line 1) | function a(a,b){var c=0;try{this._each(function(d){a.call(b,d,c++)})}cat...
  function b (line 1) | function b(a,b,c){var d=-a,e=[],f=this.toArray();if(1>a)return f;for(;(d...
  function c (line 1) | function c(a,b){a=a||Prototype.K;var c=!0;return this.each(function(d,e)...
  function d (line 1) | function d(a,b){a=a||Prototype.K;var c=!1;return this.each(function(d,e)...
  function e (line 1) | function e(a,b){a=a||Prototype.K;var c=[];return this.each(function(d,e)...
  function f (line 1) | function f(a,b){var c;return this.each(function(d,e){if(a.call(b,d,e))th...
  function g (line 1) | function g(a,b){var c=[];return this.each(function(d,e){a.call(b,d,e)&&c...
  function h (line 1) | function h(a,b,c){b=b||Prototype.K;var d=[];return Object.isString(a)&&(...
  function i (line 1) | function i(a){if(Object.isFunction(this.indexOf)&&-1!=this.indexOf(a))re...
  function j (line 1) | function j(a,b){return b=Object.isUndefined(b)?null:b,this.eachSlice(a,f...
  function k (line 1) | function k(a,b,c){return this.each(function(d,e){a=b.call(c,a,d,e)}),a}
  function l (line 1) | function l(a){var b=$A(arguments).slice(1);return this.map(function(c){r...
  function m (line 1) | function m(a,b){a=a||Prototype.K;var c;return this.each(function(d,e){d=...
  function n (line 1) | function n(a,b){a=a||Prototype.K;var c;return this.each(function(d,e){d=...
  function o (line 1) | function o(a,b){a=a||Prototype.K;var c=[],d=[];return this.each(function...
  function p (line 1) | function p(a){var b=[];return this.each(function(c){b.push(c[a])}),b}
  function q (line 1) | function q(a,b){var c=[];return this.each(function(d,e){a.call(b,d,e)||c...
  function r (line 1) | function r(a,b){return this.map(function(c,d){return{value:c,criteria:a....
  function s (line 1) | function s(){return this.map()}
  function t (line 1) | function t(){var a=Prototype.K,b=$A(arguments);Object.isFunction(b.last(...
  function u (line 1) | function u(){return this.toArray().length}
  function v (line 1) | function v(){return"#<Enumerable:"+this.toArray().inspect()+">"}
  function a (line 1) | function a(a,b){for(var c=0,d=this.length>>>0;d>c;c++)c in this&&a.call(...
  function b (line 1) | function b(){return this.length=0,this}
  function c (line 1) | function c(){return this[0]}
  function d (line 1) | function d(){return this[this.length-1]}
  function e (line 1) | function e(){return this.select(function(a){return null!=a})}
  function f (line 1) | function f(){return this.inject([],function(a,b){return Object.isArray(b...
  function g (line 1) | function g(){var a=r.call(arguments,0);return this.select(function(b){re...
  function h (line 1) | function h(a){return(a===!1?this.toArray():this)._reverse()}
  function i (line 1) | function i(a){return this.inject([],function(b,c,d){return 0!=d&&(a?b.la...
  function j (line 1) | function j(a){return this.uniq().findAll(function(b){return a.detect(fun...
  function k (line 1) | function k(){return r.call(this,0)}
  function l (line 1) | function l(){return this.length}
  function m (line 1) | function m(){return"["+this.map(Object.inspect).join(", ")+"]"}
  function n (line 1) | function n(a,b){b||(b=0);var c=this.length;for(0>b&&(b=c+b);c>b;b++)if(t...
  function o (line 1) | function o(a,b){b=isNaN(b)?this.length:(0>b?this.length+b:b)+1;var c=thi...
  function p (line 1) | function p(){for(var a,b=r.call(this,0),c=0,d=arguments.length;d>c;c++)i...
  function a (line 1) | function a(a){this._object=Object.isHash(a)?a.toObject():Object.clone(a)}
  function b (line 1) | function b(a){for(var b in this._object){var c=this._object[b],d=[b,c];d...
  function c (line 1) | function c(a,b){return this._object[a]=b}
  function d (line 1) | function d(a){return this._object[a]!==Object.prototype[a]?this._object[...
  function e (line 1) | function e(a){var b=this._object[a];return delete this._object[a],b}
  function f (line 1) | function f(){return Object.clone(this._object)}
  function g (line 1) | function g(){return this.pluck("key")}
  function h (line 1) | function h(){return this.pluck("value")}
  function i (line 1) | function i(a){var b=this.detect(function(b){return b.value===a});return ...
  function j (line 1) | function j(a){return this.clone().update(a)}
  function k (line 1) | function k(a){return new Hash(a).inject(this,function(a,b){return a.set(...
  function l (line 1) | function l(a,b){return Object.isUndefined(b)?a:a+"="+encodeURIComponent(...
  function m (line 1) | function m(){return this.inject([],function(a,b){var c=encodeURIComponen...
  function n (line 1) | function n(){return"#<Hash:{"+this.map(function(a){return a.map(Object.i...
  function o (line 1) | function o(){return new Hash(this)}
  function a (line 1) | function a(){return this.toPaddedString(2,16)}
  function b (line 1) | function b(){return this+1}
  function c (line 1) | function c(a,b){return $R(0,this,!0).each(a,b),this}
  function d (line 1) | function d(a,b){var c=this.toString(b||10);return"0".times(a-c.length)+c}
  function e (line 1) | function e(){return Math.abs(this)}
  function f (line 1) | function f(){return Math.round(this)}
  function g (line 1) | function g(){return Math.ceil(this)}
  function h (line 1) | function h(){return Math.floor(this)}
  function a (line 1) | function a(a,b,c){this.start=a,this.end=b,this.exclusive=c}
  function b (line 1) | function b(a){for(var b=this.start;this.include(b);)a(b),b=b.succ()}
  function c (line 1) | function c(a){return a<this.start?!1:this.exclusive?a<this.end:a<=this.end}
  function b (line 1) | function b(a,b){return"select"===a?!1:"type"in b?!1:!0}
  function a (line 1) | function a(a,b){a=$(a);for(var c=Element._purgeElement,g=a.getElementsBy...
  function c (line 2) | function c(a){return a.replace(/alpha\([^\)]*\)/gi,"")}
  function a (line 2) | function a(a){for(var b,c=a.getElementsByTagName("*"),d=[],e=0;b=c[e];e+...
  function a (line 2) | function a(a){if("undefined"!=typeof window.Element){var b=window.Elemen...
  function b (line 2) | function b(a,b){for(var c in b){var d=b[c];!Object.isFunction(d)||c in a...
  function b (line 2) | function b(b){b=b.toUpperCase(),Element.Methods.ByTag[b]||(Element.Metho...
  function c (line 2) | function c(a,b,c){c=c||!1;for(var d in a){var e=a[d];Object.isFunction(e...
  function d (line 2) | function d(a){var b,c={OPTGROUP:"OptGroup",TEXTAREA:"TextArea",P:"Paragr...
  function b (line 2) | function b(){return e.WebKit&&!f.evaluate?document:e.Opera&&window.parse...
  function c (line 2) | function c(c){return d||(d=b()),g[c]="client"+c,a["get"+c]=function(){re...
  function a (line 2) | function a(a){var b=a.match(/^(\d+)%?$/i);return b?Number(b[1])/100:null}
  function b (line 2) | function b(b,c,d){var e=null;if(Object.isElement(b)&&(e=b,b=e.getStyle(c...
  function c (line 2) | function c(a){for(;a&&a.parentNode;){var b=a.getStyle("display");if("non...
  function d (line 2) | function d(a){return a.include("border")&&(a+="-width"),a.camelize()}
  function e (line 2) | function e(a,b){return new Element.Layout(a,b)}
  function f (line 2) | function f(a,b){return $(a).getLayout().get(b)}
  function g (line 2) | function g(a){a=$(a);var b=Element.getStyle(a,"display");if(b&&"none"!==...
  function h (line 2) | function h(a){if(a=$(a),q(a)||r(a)||o(a)||p(a))return $(document.body);v...
  function i (line 2) | function i(a){a=$(a);var b=0,c=0;if(a.parentNode)do b+=a.offsetTop||0,c+...
  function j (line 2) | function j(a){a=$(a);var b=a.getLayout(),c=0,d=0;do if(c+=a.offsetTop||0...
  function k (line 2) | function k(a){var b=0,c=0;do b+=a.scrollTop||0,c+=a.scrollLeft||0,a=a.pa...
  function l (line 2) | function l(a){e=$(e);var b=0,c=0,d=document.body,e=a;do if(b+=e.offsetTo...
  function m (line 2) | function m(a){if(a=$(a),"absolute"===Element.getStyle(a,"position"))retu...
  function n (line 2) | function n(a){if(a=$(a),"relative"===Element.getStyle(a,"position"))retu...
  function o (line 2) | function o(a){return"BODY"===a.nodeName.toUpperCase()}
  function p (line 2) | function p(a){return"HTML"===a.nodeName.toUpperCase()}
  function q (line 2) | function q(a){return a.nodeType===Node.DOCUMENT_NODE}
  function r (line 2) | function r(a){return a!==document.body&&!Element.descendantOf(a,document...
  function a (line 2) | function a(){throw new Error('Method "Prototype.Selector.select" must be...
  function b (line 2) | function b(){throw new Error('Method "Prototype.Selector.match" must be ...
  function c (line 2) | function c(a,b,c){c=c||0;var d,e=Prototype.Selector.match,f=a.length,g=0...
  function d (line 2) | function d(a){for(var b=0,c=a.length;c>b;b++)Element.extend(a[b]);return a}
  function a (line 2) | function a(a,b,c,d,e,f){for(var g="previousSibling"==a&&!f,h=0,i=d.lengt...
  function b (line 2) | function b(a,b,c,d,e,f){for(var g="previousSibling"==a&&!f,i=0,j=d.lengt...
  function b (line 3) | function b(b,c){return d(a(b,c||document))}
  function c (line 3) | function c(b,c){return 1==a.matches(c,[b]).length}
  function a (line 3) | function a(a,d){switch(a.type.toLowerCase()){case"checkbox":case"radio":...
  function b (line 3) | function b(a,b){return Object.isUndefined(b)?a.checked?a.value:null:void...
  function c (line 3) | function c(a,b){return Object.isUndefined(b)?a.value:void(a.value=b)}
  function d (line 3) | function d(a,b){if(Object.isUndefined(b))return("select-one"===a.type?e:...
  function e (line 3) | function e(a){var b=a.selectedIndex;return b>=0?g(a.options[b]):null}
  function f (line 3) | function f(a){var b,c=a.length;if(!c)return null;for(var d=0,b=[];c>d;d+...
  function g (line 3) | function g(a){return Element.hasAttribute(a,"value")?a.value:a.text}
  function a (line 3) | function a(a,b){return a.which?a.which===b+1:a.button===b}
  function b (line 3) | function b(a,b){return a.button===y[b]}
  function c (line 3) | function c(a,b){switch(b){case 0:return 1==a.which&&!a.metaKey;case 1:re...
  function d (line 3) | function d(a){return x(a,0)}
  function e (line 3) | function e(a){return x(a,1)}
  function f (line 3) | function f(a){return x(a,2)}
  function g (line 3) | function g(a){a=t.extend(a);var b=a.target,c=a.type,d=a.currentTarget;re...
  function h (line 3) | function h(a,b){var c=t.element(a);if(!b)return c;for(;c;){if(Object.isE...
  function i (line 3) | function i(a){return{x:j(a),y:k(a)}}
  function j (line 3) | function j(a){var b=document.documentElement,c=document.body||{scrollLef...
  function k (line 3) | function k(a){var b=document.documentElement,c=document.body||{scrollTop...
  function l (line 3) | function l(a){t.extend(a),a.preventDefault(),a.stopPropagation(),a.stopp...
  function m (line 3) | function m(a){var b;switch(a.type){case"mouseover":case"mouseenter":b=a....
  function n (line 3) | function n(a,b,c){var d=Element.retrieve(a,"prototype_event_registry");O...
  function o (line 3) | function o(){for(var a=0,b=B.length;b>a;a++)t.stopObserving(B[a]),B[a]=n...
  function p (line 3) | function p(a,b,c){a=$(a);var d=n(a,b,c);if(!d)return a;if(b.include(":")...
  function q (line 3) | function q(a,b,c){a=$(a);var d=Element.retrieve(a,"prototype_event_regis...
  function r (line 3) | function r(a,b,c,d){a=$(a),Object.isUndefined(d)&&(d=!0),a==document&&do...
  function s (line 3) | function s(a,b,c,d){return a=$(a),Object.isFunction(c)&&Object.isUndefin...
  function a (line 3) | function a(){document.loaded||(d&&window.clearTimeout(d),document.loaded...
  function b (line 3) | function b(){"complete"===document.readyState&&(document.stopObserving("...
  function c (line 3) | function c(){try{document.documentElement.doScroll("left")}catch(b){retu...
  function b (line 3) | function b(a){return a.blank()?null:"[contains(concat(' ', @class, ' '),...

FILE: works/demo/ali/file/s_code_h.js
  function safariHandler (line 1) | function safariHandler(a){s.lt(a.href)&&a.addEventListener("mouseup",fun...
  function s_getObjectID (line 1) | function s_getObjectID(a){var b=a.href;return b}
  function QTCheck (line 1) | function QTCheck(){return AC&&"undefined"!=typeof AC.Detector&&"undefine...
  function s_doPlugins (line 1) | function s_doPlugins(a){function b(){if(a.u.match(/windows/i))return voi...
  function s_gi (line 1) | function s_gi(a,b,c){var d,e,f,g,h,i="s.version='H.25.5';s.an=s_an;s.log...
  function s_giqf (line 2) | function s_giqf(){var a,b,c,d=window,e=d.s_giq;if(e)for(a=0;a<e.length;a...
  function a (line 2) | function a(a,b){AC.Element.addEventListener(a,"mouseup",function(){AC.St...
  function a (line 2) | function a(a){for(var b=0;b<=p.length;b++)if(a==p[b])return b+1}

FILE: works/demo/ali/file/sizzle.js
  function c (line 1) | function c(a,b,c,d){for(var e=0,f=b.length;f>e;e++)eb(a,b[e],c,d)}
  function d (line 1) | function d(a,b,d,e,f,g){var h,i=fb.setFilters[b.toLowerCase()];return i|...
  function e (line 1) | function e(a,e,f,g,h){for(var i,j,k,l,m,n,o,p,q=0,r=h.length,s=S.POS,t=n...
  function f (line 1) | function f(a,b,c){for(var d,e,f,g=[],h=0,i=K.exec(a),j=!i.pop()&&!i.pop(...
  function g (line 1) | function g(a,b,c){var d=b.dir,e=u++;return a||(a=function(a){return a===...
  function h (line 1) | function h(a,b){return a?function(c,d){var e=b(c,d);return e&&a(e===!0?c...
  function i (line 1) | function i(a,b,c){for(var d,e,f=0;d=a[f];f++)fb.relative[d.part]?e=g(e,f...
  function j (line 1) | function j(a){return function(b,c){for(var d,e=0;d=a[e];e++)if(d(b,c))re...

FILE: works/demo/ali/startmove.js
  function startMove (line 1) | function startMove(obj, json, fnEnd) {
  function getStyle (line 16) | function getStyle(obj, attr){
  function doMove (line 20) | function doMove(obj, json, fnEnd) {

FILE: works/demo/d3/d3.v3.js
  function d3_ascending (line 36) | function d3_ascending(a, b) {
  function d3_number (line 81) | function d3_number(x) {
  function d3_numeric (line 84) | function d3_numeric(x) {
  function d3_bisector (line 118) | function d3_bisector(compare) {
  function d3_zipLength (line 175) | function d3_zipLength(d) {
  function d3_range_integerScale (line 227) | function d3_range_integerScale(x) {
  function d3_class (line 232) | function d3_class(ctor, properties) {
  function d3_Map (line 247) | function d3_Map() {
  function d3_map_escape (line 280) | function d3_map_escape(key) {
  function d3_map_unescape (line 283) | function d3_map_unescape(key) {
  function d3_map_has (line 286) | function d3_map_has(key) {
  function d3_map_remove (line 289) | function d3_map_remove(key) {
  function d3_map_keys (line 292) | function d3_map_keys() {
  function d3_map_size (line 297) | function d3_map_size() {
  function d3_map_empty (line 302) | function d3_map_empty() {
  function map (line 308) | function map(mapType, array, depth) {
  function entries (line 332) | function entries(map, depth) {
  function d3_Set (line 374) | function d3_Set() {
  function d3_rebind (line 397) | function d3_rebind(target, source, method) {
  function d3_vendorSymbol (line 403) | function d3_vendorSymbol(object, name) {
  function d3_noop (line 412) | function d3_noop() {}
  function d3_dispatch (line 418) | function d3_dispatch() {}
  function d3_dispatch_event (line 433) | function d3_dispatch_event(dispatch) {
  function d3_eventPreventDefault (line 456) | function d3_eventPreventDefault() {
  function d3_eventSource (line 459) | function d3_eventSource() {
  function d3_eventDispatch (line 464) | function d3_eventDispatch(target) {
  function d3_selection (line 490) | function d3_selection(groups) {
  function d3_selection_selector (line 529) | function d3_selection_selector(selector) {
  function d3_selection_selectorAll (line 547) | function d3_selection_selectorAll(selector) {
  function d3_selection_attr (line 585) | function d3_selection_attr(name, value) {
  function d3_collapse (line 609) | function d3_collapse(s) {
  function d3_selection_classedRe (line 629) | function d3_selection_classedRe(name) {
  function d3_selection_classes (line 632) | function d3_selection_classes(name) {
  function d3_selection_classed (line 635) | function d3_selection_classed(name, value) {
  function d3_selection_classedName (line 648) | function d3_selection_classedName(name) {
  function d3_selection_style (line 674) | function d3_selection_style(name, value, priority) {
  function d3_selection_property (line 695) | function d3_selection_property(name, value) {
  function d3_selection_creator (line 734) | function d3_selection_creator(name) {
  function bind (line 765) | function bind(group, groupData) {
  function d3_selection_dataNode (line 833) | function d3_selection_dataNode(data) {
  function d3_selection_filter (line 855) | function d3_selection_filter(selector) {
  function d3_selection_sortComparator (line 876) | function d3_selection_sortComparator(comparator) {
  function d3_selection_each (line 887) | function d3_selection_each(groups, callback) {
  function d3_selection_enter (line 919) | function d3_selection_enter(selection) {
  function d3_selection_enterInsertBefore (line 952) | function d3_selection_enterInsertBefore(enter) {
  function d3_selection_interrupt (line 981) | function d3_selection_interrupt() {
  function d3_selection_on (line 1009) | function d3_selection_on(type, listener, capture) {
  function d3_selection_onListener (line 1046) | function d3_selection_onListener(listener, argumentz) {
  function d3_selection_onFilter (line 1058) | function d3_selection_onFilter(listener, argumentz) {
  function d3_event_dragSuppress (line 1068) | function d3_event_dragSuppress() {
  function d3_mousePoint (line 1093) | function d3_mousePoint(container, e) {
  function drag (line 1129) | function drag() {
  function dragstart (line 1132) | function dragstart(id, position, subject, move, end) {
  function d3_behavior_dragTouchId (line 1176) | function d3_behavior_dragTouchId() {
  function d3_behavior_dragTouchSubject (line 1179) | function d3_behavior_dragTouchSubject() {
  function d3_behavior_dragMouseSubject (line 1182) | function d3_behavior_dragMouseSubject() {
  function d3_sgn (line 1194) | function d3_sgn(x) {
  function d3_cross2d (line 1197) | function d3_cross2d(a, b, c) {
  function d3_acos (line 1200) | function d3_acos(x) {
  function d3_asin (line 1203) | function d3_asin(x) {
  function d3_sinh (line 1206) | function d3_sinh(x) {
  function d3_cosh (line 1209) | function d3_cosh(x) {
  function d3_tanh (line 1212) | function d3_tanh(x) {
  function d3_haversin (line 1215) | function d3_haversin(x) {
  function interpolate (line 1222) | function interpolate(t) {
  function zoom (line 1239) | function zoom(g) {
  function location (line 1332) | function location(p) {
  function point (line 1335) | function point(l) {
  function scaleTo (line 1338) | function scaleTo(s) {
  function translateTo (line 1341) | function translateTo(p, l) {
  function rescale (line 1346) | function rescale() {
  function zoomstarted (line 1354) | function zoomstarted(dispatch) {
  function zoomed (line 1359) | function zoomed(dispatch) {
  function zoomended (line 1367) | function zoomended(dispatch) {
  function mousedowned (line 1372) | function mousedowned() {
  function touchstarted (line 1387) | function touchstarted() {
  function mousewheeled (line 1459) | function mousewheeled() {
  function dblclicked (line 1472) | function dblclicked() {
  function d3_color (line 1491) | function d3_color() {}
  function d3_hsl (line 1496) | function d3_hsl(h, s, l) {
  function d3_hsl_rgb (line 1511) | function d3_hsl_rgb(h, s, l) {
  function d3_hcl (line 1531) | function d3_hcl(h, c, l) {
  function d3_hcl_lab (line 1544) | function d3_hcl_lab(h, c, l) {
  function d3_lab (line 1550) | function d3_lab(l, a, b) {
  function d3_lab_rgb (line 1565) | function d3_lab_rgb(l, a, b) {
  function d3_lab_hcl (line 1572) | function d3_lab_hcl(l, a, b) {
  function d3_lab_xyz (line 1575) | function d3_lab_xyz(x) {
  function d3_xyz_lab (line 1578) | function d3_xyz_lab(x) {
  function d3_xyz_rgb (line 1581) | function d3_xyz_rgb(r) {
  function d3_rgb (line 1585) | function d3_rgb(r, g, b) {
  function d3_rgbNumber (line 1588) | function d3_rgbNumber(value) {
  function d3_rgbString (line 1591) | function d3_rgbString(value) {
  function d3_rgb_hex (line 1614) | function d3_rgb_hex(v) {
  function d3_rgb_parse (line 1617) | function d3_rgb_parse(format, rgb, hsl) {
  function d3_rgb_hsl (line 1651) | function d3_rgb_hsl(r, g, b) {
  function d3_rgb_lab (line 1663) | function d3_rgb_lab(r, g, b) {
  function d3_rgb_xyz (line 1670) | function d3_rgb_xyz(r) {
  function d3_rgb_parseNumber (line 1673) | function d3_rgb_parseNumber(c) {
  function d3_functor (line 1829) | function d3_functor(v) {
  function d3_identity (line 1835) | function d3_identity(d) {
  function d3_xhrType (line 1839) | function d3_xhrType(response) {
  function d3_xhr (line 1846) | function d3_xhr(url, mimeType, response, callback) {
  function d3_xhr_fixCallback (line 1921) | function d3_xhr_fixCallback(callback) {
  function d3_xhrHasResponse (line 1926) | function d3_xhrHasResponse(request) {
  function dsv (line 1932) | function dsv(url, row, callback) {
  function response (line 1940) | function response(request) {
  function typedResponse (line 1943) | function typedResponse(f) {
  function token (line 1962) | function token() {
  function formatRow (line 2024) | function formatRow(row) {
  function formatValue (line 2027) | function formatValue(text) {
  function d3_timer_step (line 2055) | function d3_timer_step() {
  function d3_timer_mark (line 2072) | function d3_timer_mark() {
  function d3_timer_sweep (line 2081) | function d3_timer_sweep() {
  function d3_format_precision (line 2094) | function d3_format_precision(x, p) {
  function d3_formatPrefix (line 2111) | function d3_formatPrefix(d, i) {
  function d3_locale_numberFormat (line 2122) | function d3_locale_numberFormat(locale) {
  function d3_format_typeDefault (line 2243) | function d3_format_typeDefault(x) {
  function d3_date_utc (line 2247) | function d3_date_utc() {
  function d3_time_interval (line 2313) | function d3_time_interval(local, step, number) {
  function d3_time_interval_utc (line 2361) | function d3_time_interval_utc(method) {
  function d3_locale_timeFormat (line 2421) | function d3_locale_timeFormat(locale) {
  function d3_time_formatPad (line 2641) | function d3_time_formatPad(value, fill, width) {
  function d3_time_formatRe (line 2645) | function d3_time_formatRe(names) {
  function d3_time_formatLookup (line 2648) | function d3_time_formatLookup(names) {
  function d3_time_parseWeekdayNumber (line 2653) | function d3_time_parseWeekdayNumber(date, string, i) {
  function d3_time_parseWeekNumberSunday (line 2658) | function d3_time_parseWeekNumberSunday(date, string, i) {
  function d3_time_parseWeekNumberMonday (line 2663) | function d3_time_parseWeekNumberMonday(date, string, i) {
  function d3_time_parseFullYear (line 2668) | function d3_time_parseFullYear(date, string, i) {
  function d3_time_parseYear (line 2673) | function d3_time_parseYear(date, string, i) {
  function d3_time_parseZone (line 2678) | function d3_time_parseZone(date, string, i) {
  function d3_time_expandYear (line 2682) | function d3_time_expandYear(d) {
  function d3_time_parseMonthNumber (line 2685) | function d3_time_parseMonthNumber(date, string, i) {
  function d3_time_parseDay (line 2690) | function d3_time_parseDay(date, string, i) {
  function d3_time_parseDayOfYear (line 2695) | function d3_time_parseDayOfYear(date, string, i) {
  function d3_time_parseHour24 (line 2700) | function d3_time_parseHour24(date, string, i) {
  function d3_time_parseMinutes (line 2705) | function d3_time_parseMinutes(date, string, i) {
  function d3_time_parseSeconds (line 2710) | function d3_time_parseSeconds(date, string, i) {
  function d3_time_parseMilliseconds (line 2715) | function d3_time_parseMilliseconds(date, string, i) {
  function d3_time_zone (line 2720) | function d3_time_zone(d) {
  function d3_time_parseLiteralPercent (line 2724) | function d3_time_parseLiteralPercent(date, string, i) {
  function d3_time_formatMulti (line 2729) | function d3_time_formatMulti(formats) {
  function d3_adder (line 2760) | function d3_adder() {}
  function d3_adderSum (line 2777) | function d3_adderSum(a, b, o) {
  function d3_geo_streamGeometry (line 2788) | function d3_geo_streamGeometry(geometry, listener) {
  function d3_geo_streamLine (line 2833) | function d3_geo_streamLine(coordinates, listener, closed) {
  function d3_geo_streamPolygon (line 2839) | function d3_geo_streamPolygon(coordinates, listener) {
  function d3_geo_areaRingStart (line 2868) | function d3_geo_areaRingStart() {
  function d3_geo_cartesian (line 2886) | function d3_geo_cartesian(spherical) {
  function d3_geo_cartesianDot (line 2890) | function d3_geo_cartesianDot(a, b) {
  function d3_geo_cartesianCross (line 2893) | function d3_geo_cartesianCross(a, b) {
  function d3_geo_cartesianAdd (line 2896) | function d3_geo_cartesianAdd(a, b) {
  function d3_geo_cartesianScale (line 2901) | function d3_geo_cartesianScale(vector, k) {
  function d3_geo_cartesianNormalize (line 2904) | function d3_geo_cartesianNormalize(d) {
  function d3_geo_spherical (line 2910) | function d3_geo_spherical(cartesian) {
  function d3_geo_sphericalEqual (line 2913) | function d3_geo_sphericalEqual(a, b) {
  function point (line 2938) | function point(λ, φ) {
  function linePoint (line 2943) | function linePoint(λ, φ) {
  function lineStart (line 2983) | function lineStart() {
  function lineEnd (line 2986) | function lineEnd() {
  function ringPoint (line 2991) | function ringPoint(λ, φ) {
  function ringStart (line 2999) | function ringStart() {
  function ringEnd (line 3002) | function ringEnd() {
  function angle (line 3009) | function angle(λ0, λ1) {
  function compareRanges (line 3012) | function compareRanges(a, b) {
  function withinRange (line 3015) | function withinRange(x, range) {
  function d3_geo_centroidPoint (line 3069) | function d3_geo_centroidPoint(λ, φ) {
  function d3_geo_centroidPointXYZ (line 3074) | function d3_geo_centroidPointXYZ(x, y, z) {
  function d3_geo_centroidLineStart (line 3080) | function d3_geo_centroidLineStart() {
  function d3_geo_centroidLineEnd (line 3101) | function d3_geo_centroidLineEnd() {
  function d3_geo_centroidRingStart (line 3104) | function d3_geo_centroidRingStart() {
  function d3_true (line 3134) | function d3_true() {
  function d3_geo_clipPolygon (line 3137) | function d3_geo_clipPolygon(segments, compare, clipStartInside, interpol...
  function d3_geo_clipPolygonLinkCircular (line 3196) | function d3_geo_clipPolygonLinkCircular(array) {
  function d3_geo_clipPolygonIntersection (line 3207) | function d3_geo_clipPolygonIntersection(point, points, other, entry) {
  function d3_geo_clip (line 3215) | function d3_geo_clip(pointVisible, clipLine, interpolate, clipStart) {
  function d3_geo_clipSegmentLength1 (line 3307) | function d3_geo_clipSegmentLength1(segment) {
  function d3_geo_clipBufferListener (line 3310) | function d3_geo_clipBufferListener() {
  function d3_geo_clipSort (line 3331) | function d3_geo_clipSort(a, b) {
  function d3_geo_clipAntimeridianLine (line 3335) | function d3_geo_clipAntimeridianLine(listener) {
  function d3_geo_clipAntimeridianIntersect (line 3374) | function d3_geo_clipAntimeridianIntersect(λ0, φ0, λ1, φ1) {
  function d3_geo_clipAntimeridianInterpolate (line 3378) | function d3_geo_clipAntimeridianInterpolate(from, to, direction, listene...
  function d3_geo_pointInPolygon (line 3401) | function d3_geo_pointInPolygon(point, polygon) {
  function d3_geo_clipCircle (line 3430) | function d3_geo_clipCircle(radius) {
  function d3_geom_clipLine (line 3526) | function d3_geom_clipLine(x0, y0, x1, y1) {
  function d3_geo_clipExtent (line 3598) | function d3_geo_clipExtent(x0, y0, x1, y1) {
  function d3_geo_compose (line 3732) | function d3_geo_compose(a, b) {
  function d3_geo_conic (line 3741) | function d3_geo_conic(projectAt) {
  function d3_geo_conicEqualArea (line 3749) | function d3_geo_conicEqualArea(φ0, φ1) {
  function albersUsa (line 3776) | function albersUsa(coordinates) {
  function d3_geo_pathAreaRingStart (line 3858) | function d3_geo_pathAreaRingStart() {
  function d3_geo_pathBoundsPoint (line 3880) | function d3_geo_pathBoundsPoint(x, y) {
  function d3_geo_pathBuffer (line 3886) | function d3_geo_pathBuffer() {
  function d3_geo_pathBufferCircle (line 3931) | function d3_geo_pathBufferCircle(radius) {
  function d3_geo_pathCentroidPoint (line 3947) | function d3_geo_pathCentroidPoint(x, y) {
  function d3_geo_pathCentroidLineStart (line 3952) | function d3_geo_pathCentroidLineStart() {
  function d3_geo_pathCentroidLineEnd (line 3966) | function d3_geo_pathCentroidLineEnd() {
  function d3_geo_pathCentroidRingStart (line 3969) | function d3_geo_pathCentroidRingStart() {
  function d3_geo_pathContext (line 3990) | function d3_geo_pathContext(context) {
  function d3_geo_resample (line 4030) | function d3_geo_resample(project) {
  function path (line 4110) | function path(object) {
  function reset (line 4149) | function reset() {
  function d3_geo_pathProjectStream (line 4155) | function d3_geo_pathProjectStream(project) {
  function d3_geo_transform (line 4172) | function d3_geo_transform(stream) {
  function d3_geo_transformPoint (line 4195) | function d3_geo_transformPoint(stream, point) {
  function d3_geo_projection (line 4217) | function d3_geo_projection(project) {
  function d3_geo_projectionMutator (line 4222) | function d3_geo_projectionMutator(projectAt) {
  function d3_geo_projectionRadians (line 4294) | function d3_geo_projectionRadians(stream) {
  function d3_geo_equirectangular (line 4299) | function d3_geo_equirectangular(λ, φ) {
  function forward (line 4307) | function forward(coordinates) {
  function d3_geo_identityRotation (line 4317) | function d3_geo_identityRotation(λ, φ) {
  function d3_geo_rotation (line 4321) | function d3_geo_rotation(δλ, δφ, δγ) {
  function d3_geo_forwardRotationλ (line 4324) | function d3_geo_forwardRotationλ(δλ) {
  function d3_geo_rotationλ (line 4329) | function d3_geo_rotationλ(δλ) {
  function d3_geo_rotationφγ (line 4334) | function d3_geo_rotationφγ(δφ, δγ) {
  function circle (line 4348) | function circle() {
  function d3_geo_circleInterpolate (line 4378) | function d3_geo_circleInterpolate(radius, precision) {
  function d3_geo_circleAngle (line 4395) | function d3_geo_circleAngle(cr, point) {
  function graticule (line 4408) | function graticule() {
  function lines (line 4414) | function lines() {
  function d3_geo_graticuleX (line 4480) | function d3_geo_graticuleX(y0, y1, dy) {
  function d3_geo_graticuleY (line 4488) | function d3_geo_graticuleY(x0, x1, dx) {
  function d3_source (line 4496) | function d3_source(d) {
  function d3_target (line 4499) | function d3_target(d) {
  function greatArc (line 4504) | function greatArc() {
  function d3_geo_interpolate (line 4531) | function d3_geo_interpolate(x0, y0, x1, y1) {
  function d3_geo_lengthLineStart (line 4556) | function d3_geo_lengthLineStart() {
  function d3_geo_azimuthal (line 4571) | function d3_geo_azimuthal(scale, angle) {
  function d3_geo_conicConformal (line 4597) | function d3_geo_conicConformal(φ0, φ1) {
  function d3_geo_conicEquidistant (line 4620) | function d3_geo_conicEquidistant(φ0, φ1) {
  function d3_geo_mercator (line 4642) | function d3_geo_mercator(λ, φ) {
  function d3_geo_mercatorProjection (line 4648) | function d3_geo_mercatorProjection(project) {
  function d3_geo_transverseMercator (line 4689) | function d3_geo_transverseMercator(λ, φ) {
  function d3_geom_pointX (line 4707) | function d3_geom_pointX(d) {
  function d3_geom_pointY (line 4710) | function d3_geom_pointY(d) {
  function hull (line 4716) | function hull(data) {
  function d3_geom_hullUpper (line 4738) | function d3_geom_hullUpper(points) {
  function d3_geom_hullOrder (line 4746) | function d3_geom_hullOrder(a, b) {
  function d3_geom_polygonInside (line 4800) | function d3_geom_polygonInside(p, a, b) {
  function d3_geom_polygonIntersect (line 4803) | function d3_geom_polygonIntersect(c, d, a, b) {
  function d3_geom_polygonClosed (line 4807) | function d3_geom_polygonClosed(coordinates) {
  function d3_geom_voronoiBeach (line 4812) | function d3_geom_voronoiBeach() {
  function d3_geom_voronoiCreateBeach (line 4816) | function d3_geom_voronoiCreateBeach(site) {
  function d3_geom_voronoiDetachBeach (line 4821) | function d3_geom_voronoiDetachBeach(beach) {
  function d3_geom_voronoiRemoveBeach (line 4827) | function d3_geom_voronoiRemoveBeach(beach) {
  function d3_geom_voronoiAddBeach (line 4863) | function d3_geom_voronoiAddBeach(site) {
  function d3_geom_voronoiLeftBreakPoint (line 4917) | function d3_geom_voronoiLeftBreakPoint(arc, directrix) {
  function d3_geom_voronoiRightBreakPoint (line 4929) | function d3_geom_voronoiRightBreakPoint(arc, directrix) {
  function d3_geom_voronoiCell (line 4935) | function d3_geom_voronoiCell(site) {
  function d3_geom_voronoiCloseCells (line 4948) | function d3_geom_voronoiCloseCells(extent) {
  function d3_geom_voronoiHalfEdgeOrder (line 4978) | function d3_geom_voronoiHalfEdgeOrder(a, b) {
  function d3_geom_voronoiCircle (line 4981) | function d3_geom_voronoiCircle() {
  function d3_geom_voronoiAttachCircle (line 4985) | function d3_geom_voronoiAttachCircle(arc) {
  function d3_geom_voronoiDetachCircle (line 5018) | function d3_geom_voronoiDetachCircle(arc) {
  function d3_geom_voronoiClipEdges (line 5028) | function d3_geom_voronoiClipEdges(extent) {
  function d3_geom_voronoiConnectEdge (line 5038) | function d3_geom_voronoiConnectEdge(edge, extent) {
  function d3_geom_voronoiEdge (line 5112) | function d3_geom_voronoiEdge(lSite, rSite) {
  function d3_geom_voronoiCreateEdge (line 5117) | function d3_geom_voronoiCreateEdge(lSite, rSite, va, vb) {
  function d3_geom_voronoiCreateBorderEdge (line 5126) | function d3_geom_voronoiCreateBorderEdge(lSite, va, vb) {
  function d3_geom_voronoiSetEdgeEnd (line 5133) | function d3_geom_voronoiSetEdgeEnd(edge, lSite, rSite, vertex) {
  function d3_geom_voronoiHalfEdge (line 5144) | function d3_geom_voronoiHalfEdge(edge, lSite, rSite) {
  function d3_geom_voronoiRedBlackTree (line 5158) | function d3_geom_voronoiRedBlackTree() {
  function d3_geom_voronoiRedBlackNode (line 5161) | function d3_geom_voronoiRedBlackNode(node) {
  function d3_geom_voronoiRedBlackRotateLeft (line 5324) | function d3_geom_voronoiRedBlackRotateLeft(tree, node) {
  function d3_geom_voronoiRedBlackRotateRight (line 5337) | function d3_geom_voronoiRedBlackRotateRight(tree, node) {
  function d3_geom_voronoiRedBlackFirst (line 5350) | function d3_geom_voronoiRedBlackFirst(node) {
  function d3_geom_voronoi (line 5354) | function d3_geom_voronoi(sites, bbox) {
  function d3_geom_voronoiVertexOrder (line 5383) | function d3_geom_voronoiVertexOrder(a, b) {
  function voronoi (line 5389) | function voronoi(data) {
  function sites (line 5400) | function sites(data) {
  function d3_geom_voronoiTriangleArea (line 5453) | function d3_geom_voronoiTriangleArea(a, b, c) {
  function quadtree (line 5471) | function quadtree(data) {
  function d3_geom_quadtreeCompatX (line 5563) | function d3_geom_quadtreeCompatX(d) {
  function d3_geom_quadtreeCompatY (line 5566) | function d3_geom_quadtreeCompatY(d) {
  function d3_geom_quadtreeNode (line 5569) | function d3_geom_quadtreeNode() {
  function d3_geom_quadtreeVisit (line 5578) | function d3_geom_quadtreeVisit(f, node, x1, y1, x2, y2) {
  function d3_interpolateRgb (line 5588) | function d3_interpolateRgb(a, b) {
  function d3_interpolateObject (line 5597) | function d3_interpolateObject(a, b) {
  function d3_interpolateNumber (line 5617) | function d3_interpolateNumber(a, b) {
  function d3_interpolateString (line 5624) | function d3_interpolateString(a, b) {
  function d3_interpolate (line 5658) | function d3_interpolate(a, b) {
  function d3_interpolateArray (line 5668) | function d3_interpolateArray(a, b) {
  function d3_ease_clamp (line 5719) | function d3_ease_clamp(f) {
  function d3_ease_reverse (line 5724) | function d3_ease_reverse(f) {
  function d3_ease_reflect (line 5729) | function d3_ease_reflect(f) {
  function d3_ease_quad (line 5734) | function d3_ease_quad(t) {
  function d3_ease_cubic (line 5737) | function d3_ease_cubic(t) {
  function d3_ease_cubicInOut (line 5740) | function d3_ease_cubicInOut(t) {
  function d3_ease_poly (line 5746) | function d3_ease_poly(e) {
  function d3_ease_sin (line 5751) | function d3_ease_sin(t) {
  function d3_ease_exp (line 5754) | function d3_ease_exp(t) {
  function d3_ease_circle (line 5757) | function d3_ease_circle(t) {
  function d3_ease_elastic (line 5760) | function d3_ease_elastic(a, p) {
  function d3_ease_back (line 5768) | function d3_ease_back(s) {
  function d3_ease_bounce (line 5774) | function d3_ease_bounce(t) {
  function d3_interpolateHcl (line 5778) | function d3_interpolateHcl(a, b) {
  function d3_interpolateHsl (line 5789) | function d3_interpolateHsl(a, b) {
  function d3_interpolateLab (line 5800) | function d3_interpolateLab(a, b) {
  function d3_interpolateRound (line 5809) | function d3_interpolateRound(a, b) {
  function d3_transform (line 5825) | function d3_transform(m) {
  function d3_transformDot (line 5841) | function d3_transformDot(a, b) {
  function d3_transformNormalize (line 5844) | function d3_transformNormalize(a) {
  function d3_transformCombine (line 5852) | function d3_transformCombine(a, b, k) {
  function d3_interpolateTransform (line 5866) | function d3_interpolateTransform(a, b) {
  function d3_uninterpolateNumber (line 5918) | function d3_uninterpolateNumber(a, b) {
  function d3_uninterpolateClamp (line 5924) | function d3_uninterpolateClamp(a, b) {
  function d3_layout_bundlePath (line 5938) | function d3_layout_bundlePath(link) {
  function d3_layout_bundleAncestors (line 5951) | function d3_layout_bundleAncestors(node) {
  function d3_layout_bundleLeastCommonAncestor (line 5961) | function d3_layout_bundleLeastCommonAncestor(a, b) {
  function relayout (line 5973) | function relayout() {
  function resort (line 6039) | function resort() {
  function repulse (line 6086) | function repulse(node) {
  function position (line 6258) | function position(dimension, size) {
  function dragmove (line 6287) | function dragmove(d) {
  function d3_layout_forceDragstart (line 6293) | function d3_layout_forceDragstart(d) {
  function d3_layout_forceDragend (line 6296) | function d3_layout_forceDragend(d) {
  function d3_layout_forceMouseover (line 6299) | function d3_layout_forceMouseover(d) {
  function d3_layout_forceMouseout (line 6303) | function d3_layout_forceMouseout(d) {
  function d3_layout_forceAccumulate (line 6306) | function d3_layout_forceAccumulate(quad, alpha, charges) {
  function hierarchy (line 6336) | function hierarchy(root) {
  function d3_layout_hierarchyRebind (line 6392) | function d3_layout_hierarchyRebind(object, hierarchy) {
  function d3_layout_hierarchyVisitBefore (line 6398) | function d3_layout_hierarchyVisitBefore(node, callback) {
  function d3_layout_hierarchyVisitAfter (line 6408) | function d3_layout_hierarchyVisitAfter(node, callback) {
  function d3_layout_hierarchyChildren (line 6421) | function d3_layout_hierarchyChildren(d) {
  function d3_layout_hierarchyValue (line 6424) | function d3_layout_hierarchyValue(d) {
  function d3_layout_hierarchySort (line 6427) | function d3_layout_hierarchySort(a, b) {
  function d3_layout_hierarchyLinks (line 6430) | function d3_layout_hierarchyLinks(nodes) {
  function position (line 6442) | function position(node, x, dx, dy) {
  function depth (line 6457) | function depth(node) {
  function partition (line 6465) | function partition(d, i) {
  function pie (line 6479) | function pie(data) {
  function stack (line 6528) | function stack(data, index) {
  function d3_layout_stackX (line 6583) | function d3_layout_stackX(d) {
  function d3_layout_stackY (line 6586) | function d3_layout_stackY(d) {
  function d3_layout_stackOut (line 6589) | function d3_layout_stackOut(d, y0, y) {
  function d3_layout_stackOrderDefault (line 6656) | function d3_layout_stackOrderDefault(data) {
  function d3_layout_stackOffsetZero (line 6659) | function d3_layout_stackOffsetZero(data) {
  function d3_layout_stackMaxIndex (line 6664) | function d3_layout_stackMaxIndex(array) {
  function d3_layout_stackReduceSum (line 6674) | function d3_layout_stackReduceSum(d) {
  function d3_layout_stackSum (line 6677) | function d3_layout_stackSum(p, d) {
  function histogram (line 6682) | function histogram(data, i) {
  function d3_layout_histogramBinSturges (line 6726) | function d3_layout_histogramBinSturges(range, values) {
  function d3_layout_histogramBinFixed (line 6729) | function d3_layout_histogramBinFixed(range, n) {
  function d3_layout_histogramRange (line 6734) | function d3_layout_histogramRange(values) {
  function pack (line 6739) | function pack(d, i) {
  function d3_layout_packSort (line 6778) | function d3_layout_packSort(a, b) {
  function d3_layout_packInsert (line 6781) | function d3_layout_packInsert(a, b) {
  function d3_layout_packSplice (line 6788) | function d3_layout_packSplice(a, b) {
  function d3_layout_packIntersects (line 6792) | function d3_layout_packIntersects(a, b) {
  function d3_layout_packSiblings (line 6796) | function d3_layout_packSiblings(node) {
  function d3_layout_packLink (line 6860) | function d3_layout_packLink(node) {
  function d3_layout_packUnlink (line 6863) | function d3_layout_packUnlink(node) {
  function d3_layout_packTransform (line 6867) | function d3_layout_packTransform(node, x, y, k) {
  function d3_layout_packPlace (line 6877) | function d3_layout_packPlace(a, b, c) {
  function tree (line 6893) | function tree(d, i) {
  function wrapTree (line 6912) | function wrapTree(root0) {
  function firstWalk (line 6936) | function firstWalk(v) {
  function secondWalk (line 6952) | function secondWalk(v) {
  function apportion (line 6956) | function apportion(v, w, ancestor) {
  function sizeNode (line 6986) | function sizeNode(node) {
  function d3_layout_treeSeparation (line 7007) | function d3_layout_treeSeparation(a, b) {
  function d3_layout_treeLeft (line 7010) | function d3_layout_treeLeft(v) {
  function d3_layout_treeRight (line 7014) | function d3_layout_treeRight(v) {
  function d3_layout_treeMove (line 7018) | function d3_layout_treeMove(wm, wp, shift) {
  function d3_layout_treeShift (line 7026) | function d3_layout_treeShift(v) {
  function d3_layout_treeAncestor (line 7035) | function d3_layout_treeAncestor(vim, v, ancestor) {
  function cluster (line 7040) | function cluster(d, i) {
  function d3_layout_clusterY (line 7080) | function d3_layout_clusterY(children) {
  function d3_layout_clusterX (line 7085) | function d3_layout_clusterX(children) {
  function d3_layout_clusterLeft (line 7090) | function d3_layout_clusterLeft(node) {
  function d3_layout_clusterRight (line 7094) | function d3_layout_clusterRight(node) {
  function scale (line 7100) | function scale(children, k) {
  function squarify (line 7107) | function squarify(node) {
  function stickify (line 7134) | function stickify(node) {
  function worst (line 7151) | function worst(row, u) {
  function position (line 7162) | function position(row, u, rect, flush) {
  function treemap (line 7192) | function treemap(d) {
  function padFunction (line 7211) | function padFunction(node) {
  function padConstant (line 7215) | function padConstant(node) {
  function d3_layout_treemapPadNull (line 7246) | function d3_layout_treemapPadNull(node) {
  function d3_layout_treemapPad (line 7254) | function d3_layout_treemapPad(node, padding) {
  function d3_scaleExtent (line 7306) | function d3_scaleExtent(domain) {
  function d3_scaleRange (line 7310) | function d3_scaleRange(scale) {
  function d3_scale_bilinear (line 7313) | function d3_scale_bilinear(domain, range, uninterpolate, interpolate) {
  function d3_scale_nice (line 7319) | function d3_scale_nice(domain, nice) {
  function d3_scale_niceStep (line 7329) | function d3_scale_niceStep(step) {
  function d3_scale_polylinear (line 7343) | function d3_scale_polylinear(domain, range, uninterpolate, interpolate) {
  function d3_scale_linear (line 7361) | function d3_scale_linear(domain, range, interpolate, clamp) {
  function d3_scale_linearRebind (line 7413) | function d3_scale_linearRebind(scale, linear) {
  function d3_scale_linearNice (line 7416) | function d3_scale_linearNice(domain, m) {
  function d3_scale_linearTickRange (line 7419) | function d3_scale_linearTickRange(domain, m) {
  function d3_scale_linearTicks (line 7428) | function d3_scale_linearTicks(domain, m) {
  function d3_scale_linearTickFormat (line 7431) | function d3_scale_linearTickFormat(domain, m, format) {
  function d3_scale_linearPrecision (line 7459) | function d3_scale_linearPrecision(value) {
  function d3_scale_linearFormatPrecision (line 7462) | function d3_scale_linearFormatPrecision(type, range) {
  function d3_scale_log (line 7469) | function d3_scale_log(linear, base, positive, domain) {
  function d3_scale_pow (line 7541) | function d3_scale_pow(linear, exponent, domain) {
  function d3_scale_powPow (line 7575) | function d3_scale_powPow(e) {
  function d3_scale_ordinal (line 7589) | function d3_scale_ordinal(domain, ranger) {
  function d3_scale_quantile (line 7684) | function d3_scale_quantile(domain, range) {
  function d3_scale_quantize (line 7720) | function d3_scale_quantize(x0, x1, range) {
  function d3_scale_threshold (line 7754) | function d3_scale_threshold(domain, range) {
  function d3_scale_identity (line 7780) | function d3_scale_identity(domain) {
  function arc (line 7804) | function arc() {
  function d3_svg_arcInnerRadius (line 7836) | function d3_svg_arcInnerRadius(d) {
  function d3_svg_arcOuterRadius (line 7839) | function d3_svg_arcOuterRadius(d) {
  function d3_svg_arcStartAngle (line 7842) | function d3_svg_arcStartAngle(d) {
  function d3_svg_arcEndAngle (line 7845) | function d3_svg_arcEndAngle(d) {
  function d3_svg_line (line 7848) | function d3_svg_line(projection) {
  function d3_svg_lineLinear (line 7915) | function d3_svg_lineLinear(points) {
  function d3_svg_lineLinearClosed (line 7918) | function d3_svg_lineLinearClosed(points) {
  function d3_svg_lineStep (line 7921) | function d3_svg_lineStep(points) {
  function d3_svg_lineStepBefore (line 7927) | function d3_svg_lineStepBefore(points) {
  function d3_svg_lineStepAfter (line 7932) | function d3_svg_lineStepAfter(points) {
  function d3_svg_lineCardinalOpen (line 7937) | function d3_svg_lineCardinalOpen(points, tension) {
  function d3_svg_lineCardinalClosed (line 7940) | function d3_svg_lineCardinalClosed(points, tension) {
  function d3_svg_lineCardinal (line 7944) | function d3_svg_lineCardinal(points, tension) {
  function d3_svg_lineHermite (line 7947) | function d3_svg_lineHermite(points, tangents) {
  function d3_svg_lineCardinalTangents (line 7974) | function d3_svg_lineCardinalTangents(points, tension) {
  function d3_svg_lineBasis (line 7984) | function d3_svg_lineBasis(points) {
  function d3_svg_lineBasisOpen (line 8000) | function d3_svg_lineBasisOpen(points) {
  function d3_svg_lineBasisClosed (line 8020) | function d3_svg_lineBasisClosed(points) {
  function d3_svg_lineBundle (line 8039) | function d3_svg_lineBundle(points, tension) {
  function d3_svg_lineDot4 (line 8052) | function d3_svg_lineDot4(a, b) {
  function d3_svg_lineBasisBezier (line 8056) | function d3_svg_lineBasisBezier(path, x, y) {
  function d3_svg_lineSlope (line 8059) | function d3_svg_lineSlope(p0, p1) {
  function d3_svg_lineFiniteDifferences (line 8062) | function d3_svg_lineFiniteDifferences(points) {
  function d3_svg_lineMonotoneTangents (line 8070) | function d3_svg_lineMonotoneTangents(points) {
  function d3_svg_lineMonotone (line 8094) | function d3_svg_lineMonotone(points) {
  function d3_svg_lineRadial (line 8103) | function d3_svg_lineRadial(points) {
  function d3_svg_area (line 8114) | function d3_svg_area(projection) {
  function chord (line 8204) | function chord(d, i) {
  function subgroup (line 8208) | function subgroup(self, f, d, i) {
  function equals (line 8218) | function equals(a, b) {
  function arc (line 8221) | function arc(r, p, a) {
  function curve (line 8224) | function curve(r0, p0, r1, p1) {
  function d3_svg_chordRadius (line 8254) | function d3_svg_chordRadius(d) {
  function diagonal (line 8259) | function diagonal(d, i) {
  function d3_svg_diagonalProjection (line 8287) | function d3_svg_diagonalProjection(d) {
  function d3_svg_diagonalRadialProjection (line 8297) | function d3_svg_diagonalRadialProjection(projection) {
  function symbol (line 8305) | function symbol(d, i) {
  function d3_svg_symbolSize (line 8320) | function d3_svg_symbolSize() {
  function d3_svg_symbolType (line 8323) | function d3_svg_symbolType() {
  function d3_svg_symbolCircle (line 8326) | function d3_svg_symbolCircle(size) {
  function d3_transition (line 8355) | function d3_transition(groups, id) {
  function d3_transition_tween (line 8426) | function d3_transition_tween(groups, name, value, tween) {
  function attrNull (line 8440) | function attrNull() {
  function attrNullNS (line 8443) | function attrNullNS() {
  function attrTween (line 8446) | function attrTween(b) {
  function attrTweenNS (line 8454) | function attrTweenNS(b) {
  function attrTween (line 8466) | function attrTween(d, i) {
  function attrTweenNS (line 8472) | function attrTweenNS(d, i) {
  function styleNull (line 8490) | function styleNull() {
  function styleString (line 8493) | function styleString(b) {
  function styleTween (line 8505) | function styleTween(d, i) {
  function d3_transition_text (line 8516) | function d3_transition_text(b) {
  function d3_transitionNode (line 8588) | function d3_transitionNode(node, i, id, inherit) {
  function axis (line 8642) | function axis(g) {
  function d3_svg_axisX (line 8737) | function d3_svg_axisX(selection, x0, x1) {
  function d3_svg_axisY (line 8743) | function d3_svg_axisY(selection, y0, y1) {
  function brush (line 8751) | function brush(g) {
  function redraw (line 8837) | function redraw(g) {
  function redrawX (line 8842) | function redrawX(g) {
  function redrawY (line 8846) | function redrawY(g) {
  function brushstart (line 8850) | function brushstart() {
  function d3_time_formatIsoNative (line 9043) | function d3_time_formatIsoNative(date) {
  function d3_time_scale (line 9090) | function d3_time_scale(linear, methods, format) {
  function d3_time_scaleDate (line 9140) | function d3_time_scaleDate(t) {
  function d3_json (line 9199) | function d3_json(request) {
  function d3_html (line 9205) | function d3_html(request) {

FILE: works/demo/ee/index_files/analytics.js
  function Pc (line 1) | function Pc(a,b){return a.href=b}
  function fa (line 1) | function fa(a,b){return a.name=b}
  function J (line 2) | function J(a){pa.set(a)}
  function K (line 2) | function K(a){return"function"==typeof a}
  function vd (line 2) | function vd(a){return"[object Array]"==Object[z].toString[C](Object(a))}
  function qa (line 2) | function qa(a){return void 0!=a&&-1<(a.constructor+"")[t]("String")}
  function ea (line 2) | function ea(a,b){return 0==a[t](b)}
  function Lc (line 2) | function Lc(a){return a?a[Qc](/^[\s\xa0]+|[\s\xa0]+$/g,""):""}
  function Td (line 2) | function Td(){return[Ud()^Mc()&2147483647,n.round((new Date)[da]()/1E3)]...
  function Ca (line 2) | function Ca(a){var b=M[u]("img");b.width=1;b.height=1;b.src=a;return b}
  function L (line 2) | function L(){}
  function sa (line 3) | function sa(a){if(aa instanceof Function)return aa(a);J(28);return a}
  function ka (line 3) | function ka(a){return sa(a)[Qc](/\(/g,"%28")[Qc](/\)/g,"%29")}
  function vc (line 4) | function vc(a,b){if(a){var c=M[u]("script");c.type="text/javascript";c.a...
  function D (line 4) | function D(){return Ba||"https:"==M[B][E]?"https:":"http:"}
  function eb (line 4) | function eb(){var a=""+M[B][ma];return 0==a[t]("www.")?a[F](4):a}
  function va (line 4) | function va(a){var b=M.referrer;if(/^https?:\/\//i[s](b)){if(a)return b;...
  function wa (line 5) | function wa(a,b){if(1==b[y]&&null!=b[0]&&"object"===typeof b[0])return b...
  function Ja (line 9) | function Ja(a){if(100!=a.get(Ka)&&La(P(a,Q))%1E4>=100*R(a,Ka))throw"abor...
  function Ma (line 9) | function Ma(a){if(xa(P(a,Na)))throw"abort";}
  function Oa (line 9) | function Oa(){var a=M[B][E];if("http:"!=a&&"https:"!=a)throw"abort";}
  function Pa (line 10) | function Pa(a){try{O.XMLHttpRequest&&"withCredentials"in new O.XMLHttpRe...
  function Sa (line 11) | function Sa(a){var b=P(a,gd)||oc()+"/collect";Ga(b,P(a,Ra),a.get(Ia),a.g...
  function Hc (line 11) | function Hc(a){var b=O.gaData;b&&(b.expId&&a.set(Nc,b.expId),b.expVar&&a...
  function cd (line 11) | function cd(){if(O[oa]&&"preview"==O[oa].loadPurpose)throw"abort";}
  function yd (line 11) | function yd(a){var b=O.gaDevIds;vd(b)&&0!=b[y]&&a.set("&did",b[H](","),!0)}
  function vb (line 11) | function vb(a){if(!a.get(Na))throw"abort";}
  function Ta (line 11) | function Ta(a){var b=R(a,Ua);500<=b&&J(15);var c=P(a,Va);if("transaction...
  function X (line 20) | function X(a,b,c,d){b[a]=function(){try{return d&&J(d),c[G](this,argumen...
  function fc (line 20) | function fc(){var a,b,c;if((c=(c=O[oa])?c.plugins:null)&&c[y])for(var d=...
  function Xc (line 24) | function Xc(a,b,c){"none"==b&&(b="");var d=[],e=ya(a);a="__utma"==a?6:2;...
  function Zc (line 24) | function Zc(a,b){var c,d;null==a?c=d=1:(c=La(a),d=La(ea(a,".")?a[F](1):"...
  function Bc (line 24) | function Bc(a){a=a.get(Q);var b=Ic(a,0);return"_ga=1."+sa(b+"."+a)}
  function Ic (line 24) | function Ic(a,b){for(var c=new Date,d=O[oa],e=d.plugins||[],c=[a,d.userA...
  function d (line 28) | function d(c){try{c=c||O.event;var d;t:{var g=c[jd]||c.srcElement;for(c=...
  function sd (line 29) | function sd(a,b){if(b==M[B][ma])return!1;for(var c=0;c<a[y];c++)if(a[c]i...
  function $c (line 30) | function $c(){var a=O.gaGlobal=O.gaGlobal||{};return a.hid=a.hid||Ud()}
  function b (line 30) | function b(a,b){d.b[q].set(a,b)}
  function c (line 30) | function c(a,c){b(a,c);d.filters.add(a)}
  function ud (line 37) | function ud(a){return 0<=a[t](".")||0<=a[t](":")}
  function b (line 38) | function b(a){var b=(a[ma]||"")[A](":")[0][I](),c=(a[E]||"")[I](),c=1*a[...
  function La (line 43) | function La(a){var b=1,c=0,d;if(a)for(b=0,d=a[y]-1;0<=d;d--)c=a.charCode...

FILE: works/demo/ee/index_files/impress.js
  function startPres (line 1) | function startPres(document, window) {

FILE: works/demo/ee/index_files/onready.js
  function doScrollCheck (line 182) | function doScrollCheck() {
  function ready (line 215) | function ready( fn ) {

FILE: works/js/lib/angular-1.3.0.js
  function minErr (line 36) | function minErr(module) {
  function isArrayLike (line 264) | function isArrayLike(obj) {
  function forEach (line 308) | function forEach(obj, iterator, context) {
  function sortedKeys (line 335) | function sortedKeys(obj) {
  function forEachSorted (line 345) | function forEachSorted(obj, iterator, context) {
  function reverseParams (line 359) | function reverseParams(iteratorFn) {
  function nextUid (line 371) | function nextUid() {
  function setHashKey (line 399) | function setHashKey(obj, h) {
  function extend (line 422) | function extend(dst) {
  function int (line 436) | function int(str) {
  function inherit (line 441) | function inherit(parent, extra) {
  function noop (line 461) | function noop() {}
  function identity (line 481) | function identity($) {return $;}
  function valueFn (line 485) | function valueFn(value) {return function() {return value;};}
  function isUndefined (line 499) | function isUndefined(value){return typeof value === 'undefined';}
  function isDefined (line 514) | function isDefined(value){return typeof value !== 'undefined';}
  function isObject (line 530) | function isObject(value){return value != null && typeof value === 'objec...
  function isString (line 545) | function isString(value){return typeof value === 'string';}
  function isNumber (line 560) | function isNumber(value){return typeof value === 'number';}
  function isDate (line 575) | function isDate(value) {
  function isArray (line 592) | function isArray(value) {
  function isFunction (line 609) | function isFunction(value){return typeof value === 'function';}
  function isRegExp (line 619) | function isRegExp(value) {
  function isWindow (line 631) | function isWindow(obj) {
  function isScope (line 636) | function isScope(obj) {
  function isFile (line 641) | function isFile(obj) {
  function isBlob (line 646) | function isBlob(obj) {
  function isBoolean (line 651) | function isBoolean(value) {
  function isElement (line 683) | function isElement(node) {
  function makeMap (line 693) | function makeMap(str) {
  function map (line 714) | function map(obj, iterator, context) {
  function size (line 735) | function size(obj, ownPropsOnly) {
  function includes (line 750) | function includes(array, obj) {
  function indexOf (line 754) | function indexOf(array, obj) {
  function arrayRemove (line 763) | function arrayRemove(array, value) {
  function isLeafNode (line 770) | function isLeafNode (node) {
  function copy (line 839) | function copy(source, destination) {
  function shallowCopy (line 883) | function shallowCopy(src, dst) {
  function equals (line 927) | function equals(o1, o2) {
  function csp (line 968) | function csp() {
  function concat (line 975) | function concat(array1, array2, index) {
  function sliceArgs (line 979) | function sliceArgs(args, startIndex) {
  function bind (line 1003) | function bind(self, fn) {
  function toJsonReplacer (line 1024) | function toJsonReplacer(key, value) {
  function toJson (line 1055) | function toJson(obj, pretty) {
  function fromJson (line 1073) | function fromJson(json) {
  function toBoolean (line 1080) | function toBoolean(value) {
  function startingTag (line 1095) | function startingTag(element) {
  function tryDecodeURIComponent (line 1127) | function tryDecodeURIComponent(value) {
  function parseKeyValue (line 1140) | function parseKeyValue(/**string*/keyValue) {
  function toKeyValue (line 1161) | function toKeyValue(obj) {
  function encodeUriSegment (line 1189) | function encodeUriSegment(val) {
  function encodeUriQuery (line 1208) | function encodeUriQuery(val, pctEncodeSpaces) {
  function getNgAttribute (line 1219) | function getNgAttribute(element, ngAttr) {
  function angularInit (line 1358) | function angularInit(element, bootstrap) {
  function bootstrap (line 1457) | function bootstrap(element, modules, config) {
  function snake_case (line 1504) | function snake_case(name, separator) {
  function bindJQuery (line 1511) | function bindJQuery() {
  function assertArg (line 1551) | function assertArg(arg, name, reason) {
  function assertArgFn (line 1558) | function assertArgFn(arg, name, acceptArrayAnnotation) {
  function assertNotHasOwnProperty (line 1573) | function assertNotHasOwnProperty(name, context) {
  function getter (line 1587) | function getter(obj, path, bindFnToScope) {
  function getBlockElements (line 1611) | function getBlockElements(nodes) {
  function setupModuleLoader (line 1639) | function setupModuleLoader(window) {
  function publishExternalAPI (line 2048) | function publishExternalAPI(angular){
  function jqNextId (line 2285) | function jqNextId() { return ++jqId; }
  function camelCase (line 2297) | function camelCase(name) {
  function jqLiteIsTextNode (line 2324) | function jqLiteIsTextNode(html) {
  function jqLiteBuildFragment (line 2328) | function jqLiteBuildFragment(html, context) {
  function jqLiteParseHTML (line 2365) | function jqLiteParseHTML(html, context) {
  function JQLite (line 2381) | function JQLite(element) {
  function jqLiteClone (line 2402) | function jqLiteClone(element) {
  function jqLiteDealoc (line 2406) | function jqLiteDealoc(element){
  function jqLiteOff (line 2413) | function jqLiteOff(element, type, fn, unsupported) {
  function jqLiteRemoveData (line 2438) | function jqLiteRemoveData(element, name) {
  function jqLiteExpandoStore (line 2457) | function jqLiteExpandoStore(element, key, value) {
  function jqLiteData (line 2472) | function jqLiteData(element, key, value) {
  function jqLiteHasClass (line 2498) | function jqLiteHasClass(element, selector) {
  function jqLiteRemoveClass (line 2504) | function jqLiteRemoveClass(element, cssClasses) {
  function jqLiteAddClass (line 2516) | function jqLiteAddClass(element, cssClasses) {
  function jqLiteAddNodes (line 2532) | function jqLiteAddNodes(root, elements) {
  function jqLiteController (line 2543) | function jqLiteController(element, name) {
  function jqLiteInheritedData (line 2547) | function jqLiteInheritedData(element, name, value) {
  function jqLiteEmpty (line 2570) | function jqLiteEmpty(element) {
  function trigger (line 2586) | function trigger() {
  function getBooleanAttrName (line 2633) | function getBooleanAttrName(element, name) {
  function getText (line 2740) | function getText(element, value) {
  function createEventHandler (line 2825) | function createEventHandler(element, events) {
  function hashKey (line 3128) | function hashKey(obj) {
  function HashMap (line 3149) | function HashMap(array){
  function anonFn (line 3248) | function anonFn(fn) {
  function annotate (line 3259) | function annotate(fn, strictDi, name) {
  function createInjector (line 3787) | function createInjector(modulesToLoad, strictDi) {
  function $AnchorScrollProvider (line 4058) | function $AnchorScrollProvider() {
  function async (line 4193) | function async(fn) {
  function $$AsyncCallbackProvider (line 4352) | function $$AsyncCallbackProvider(){
  function Browser (line 4384) | function Browser(window, document, $log, $sniffer) {
  function $BrowserProvider (line 4738) | function $BrowserProvider(){
  function $CacheFactoryProvider (line 4824) | function $CacheFactoryProvider() {
  function $TemplateCacheProvider (line 5136) | function $TemplateCacheProvider() {
  function $CompileProvider (line 5659) | function $CompileProvider($provide, $$sanitizeUriProvider) {
  function directiveNormalize (line 7132) | function directiveNormalize(name) {
  function nodesetLinkingFn (line 7179) | function nodesetLinkingFn(
  function directiveLinkingFn (line 7186) | function directiveLinkingFn(
  function tokenDifference (line 7194) | function tokenDifference(str1, str2) {
  function $ControllerProvider (line 7220) | function $ControllerProvider() {
  function $DocumentProvider (line 7322) | function $DocumentProvider(){
  function $ExceptionHandlerProvider (line 7360) | function $ExceptionHandlerProvider() {
  function parseHeaders (line 7374) | function parseHeaders(headers) {
  function headersGetter (line 7409) | function headersGetter(headers) {
  function transformData (line 7434) | function transformData(data, headers, fns) {
  function isSuccess (line 7446) | function isSuccess(status) {
  function $HttpProvider (line 7451) | function $HttpProvider() {
  function createXhr (line 8332) | function createXhr(method) {
  function $HttpBackendProvider (line 8362) | function $HttpBackendProvider() {
  function createHttpBackend (line 8368) | function createHttpBackend($browser, createXhr, $browserDefer, callbacks...
  function $InterpolateProvider (line 8564) | function $InterpolateProvider() {
  function $IntervalProvider (line 8906) | function $IntervalProvider() {
  function $LocaleProvider (line 9100) | function $LocaleProvider(){
  function encodePath (line 9173) | function encodePath(path) {
  function parseAbsoluteUrl (line 9184) | function parseAbsoluteUrl(absoluteUrl, locationObj, appBase) {
  function parseAppUrl (line 9193) | function parseAppUrl(relativeUrl, locationObj, appBase) {
  function beginsWith (line 9218) | function beginsWith(begin, whole) {
  function stripHash (line 9225) | function stripHash(url) {
  function stripFile (line 9231) | function stripFile(url) {
  function serverBase (line 9236) | function serverBase(url) {
  function LocationHtml5Url (line 9249) | function LocationHtml5Url(appBase, basePrefix) {
  function LocationHashbangUrl (line 9317) | function LocationHashbangUrl(appBase, hashPrefix) {
  function LocationHashbangInHtml5Url (line 9410) | function LocationHashbangInHtml5Url(appBase, hashPrefix) {
  function locationGetter (line 9656) | function locationGetter(property) {
  function locationGetterSetter (line 9663) | function locationGetterSetter(property, preprocess) {
  function $LocationProvider (line 9708) | function $LocationProvider(){
  function $LogProvider (line 9956) | function $LogProvider(){
  function ensureSafeMemberName (line 10106) | function ensureSafeMemberName(name, fullExpression) {
  function ensureSafeObject (line 10115) | function ensureSafeObject(obj, fullExpression) {
  function setter (line 10887) | function setter(obj, path, setValue, fullExp, options) {
  function cspSafeGetterFn (line 10913) | function cspSafeGetterFn(key0, key1, key2, key3, key4, fullExp, options) {
  function simpleGetterFn1 (line 10946) | function simpleGetterFn1(key0, fullExp) {
  function simpleGetterFn2 (line 10955) | function simpleGetterFn2(key0, key1, fullExp) {
  function getterFn (line 10966) | function getterFn(path, options, fullExp) {
  function $ParseProvider (line 11081) | function $ParseProvider() {
  function $QProvider (line 11327) | function $QProvider() {
  function qFactory (line 11345) | function qFactory(nextTick, exceptionHandler) {
  function $$RAFProvider (line 11683) | function $$RAFProvider(){ //rAF
  function $RootScopeProvider (line 11782) | function $RootScopeProvider(){
  function $$SanitizeUriProvider (line 12928) | function $$SanitizeUriProvider() {
  function escapeForRegexp (line 13014) | function escapeForRegexp(s) {
  function adjustMatcher (line 13020) | function adjustMatcher(matcher) {
  function adjustMatchers (line 13048) | function adjustMatchers(matchers) {
  function $SceDelegateProvider (line 13124) | function $SceDelegateProvider() {
  function $SceProvider (line 13655) | function $SceProvider() {
  function $SnifferProvider (line 14070) | function $SnifferProvider() {
  function $TimeoutProvider (line 14147) | function $TimeoutProvider() {
  function urlResolve (line 14293) | function urlResolve(url, base) {
  function urlIsSameOrigin (line 14327) | function urlIsSameOrigin(requestUrl) {
  function $WindowProvider (line 14373) | function $WindowProvider(){
  function $FilterProvider (line 14469) | function $FilterProvider($provide) {
  function filterFilter (line 14637) | function filterFilter() {
  function currencyFilter (line 14791) | function currencyFilter($locale) {
  function numberFilter (line 14851) | function numberFilter($locale) {
  function formatNumber (line 14860) | function formatNumber(number, pattern, groupSep, decimalSep, fractionSiz...
  function padNumber (line 14934) | function padNumber(num, digits, trim) {
  function dateGetter (line 14948) | function dateGetter(name, size, offset, trim) {
  function dateStrGetter (line 14959) | function dateStrGetter(name, shortForm) {
  function timeZoneGetter (line 14968) | function timeZoneGetter(date) {
  function getFirstThursdayOfYear (line 14978) | function getFirstThursdayOfYear(year) {
  function getThursdayThisWeek (line 14986) | function getThursdayThisWeek(datetime) {
  function weekGetter (line 14992) | function weekGetter(size) {
  function ampmGetter (line 15004) | function ampmGetter(date, formats) {
  function dateFilter (line 15124) | function dateFilter($locale) {
  function jsonFilter (line 15227) | function jsonFilter() {
  function limitToFilter (line 15324) | function limitToFilter(){
  function orderByFilter (line 15431) | function orderByFilter($parse){
  function ngDirective (line 15488) | function ngDirective(directive) {
  function FormController (line 15989) | function FormController(element, attrs, $scope, $animate) {
  function validate (line 17247) | function validate(ctrl, validatorName, validity, value){
  function addNativeHtml5Validators (line 17253) | function addNativeHtml5Validators(ctrl, validatorName, element) {
  function textInputType (line 17270) | function textInputType(scope, element, attr, ctrl, $sniffer, $browser) {
  function weekParser (line 17421) | function weekParser(isoWeek) {
  function createDateParser (line 17441) | function createDateParser(regexp, mapping) {
  function createDateInputType (line 17471) | function createDateInputType(type, regexp, parseDate, format) {
  function numberInputType (line 17523) | function numberInputType(scope, element, attr, ctrl, $sniffer, $browser) {
  function urlInputType (line 17568) | function urlInputType(scope, element, attr, ctrl, $sniffer, $browser) {
  function emailInputType (line 17579) | function emailInputType(scope, element, attr, ctrl, $sniffer, $browser) {
  function radioInputType (line 17590) | function radioInputType(scope, element, attr, ctrl) {
  function checkboxInputType (line 17614) | function checkboxInputType(scope, element, attr, ctrl) {
  function toggleValidCss (line 18008) | function toggleValidCss(isValid, validationErrorKey) {
  function getStringValue (line 18982) | function getStringValue() {
  function classDirective (line 18994) | function classDirective(name, selector) {
  function getBlockStart (line 21180) | function getBlockStart(block) {
  function getBlockEnd (line 21184) | function getBlockEnd(block) {
  function setupAsSingle (line 22143) | function setupAsSingle(scope, selectElement, ngModelCtrl, selectCtrl) {
  function setupAsMultiple (line 22168) | function setupAsMultiple(scope, selectElement, ctrl) {
  function setupAsOptions (line 22199) | function setupAsOptions(scope, selectElement, ctrl) {

FILE: works/js/lib/angular-animate.js
  function extractElementNode (line 354) | function extractElementNode(element) {
  function prepareElement (line 363) | function prepareElement(element) {
  function stripCommentsFromElement (line 367) | function stripCommentsFromElement(element) {
  function isMatchingElement (line 371) | function isMatchingElement(elm1, elm2) {
  function lookup (line 400) | function lookup(name) {
  function animationRunner (line 430) | function animationRunner(element, animationEvent, className) {
  function performAnimation (line 878) | function performAnimation(animationEvent, className, element, parentElem...
  function cancelChildAnimations (line 1082) | function cancelChildAnimations(element) {
  function cleanup (line 1100) | function cleanup(element, className) {
  function animationsDisabled (line 1122) | function animationsDisabled(element, parentElement) {
  function afterReflow (line 1198) | function afterReflow(element, callback) {
  function animationCloseHandler (line 1217) | function animationCloseHandler(element, totalTime) {
  function closeAllAnimations (line 1241) | function closeAllAnimations(elements) {
  function getElementAnimationDetails (line 1250) | function getElementAnimationDetails(element, cacheKey) {
  function parseMaxTime (line 1308) | function parseMaxTime(str) {
  function getCacheKey (line 1319) | function getCacheKey(element) {
  function animateSetup (line 1329) | function animateSetup(animationEvent, element, className) {
  function animateRun (line 1389) | function animateRun(animationEvent, element, className, activeAnimationC...
  function prepareStaggerDelay (line 1513) | function prepareStaggerDelay(delayStyle, staggerDelay, index) {
  function animateBefore (line 1522) | function animateBefore(animationEvent, element, className, calculationDe...
  function animateAfter (line 1530) | function animateAfter(animationEvent, element, className, afterAnimation...
  function animate (line 1539) | function animate(animationEvent, element, className, animationComplete) {
  function animateClose (line 1567) | function animateClose(element, className) {
  function suffixClasses (line 1638) | function suffixClasses(classes, suffix) {

FILE: works/js/lib/angular-route.js
  function $RouteProvider (line 42) | function $RouteProvider(){
  function $RouteParamsProvider (line 638) | function $RouteParamsProvider() {
  function ngViewFactory (line 822) | function ngViewFactory(   $route,   $anchorScroll,   $animate) {
  function ngViewFillContentFactory (line 898) | function ngViewFillContentFactory($compile, $controller, $route) {

FILE: works/js/lib/angular-ui-router.js
  function inherit (line 27) | function inherit(parent, extra) {
  function merge (line 31) | function merge(dst) {
  function ancestors (line 49) | function ancestors(first, second) {
  function keys (line 65) | function keys(object) {
  function arraySearch (line 84) | function arraySearch(array, value) {
  function inheritParams (line 108) | function inheritParams(currentParams, newParams, $current, $to) {
  function normalize (line 131) | function normalize(keys, values) {
  function equalForKeys (line 150) | function equalForKeys(a, b, keys) {
  function filterByKeys (line 170) | function filterByKeys(keys, values) {
  function $Resolve (line 272) | function $Resolve(  $q,    $injector) {
  function $TemplateFactory (line 516) | function $TemplateFactory(  $http,   $templateCache,   $injector) {
  function UrlMatcher (line 672) | function UrlMatcher(pattern) {
  function $UrlMatcherFactory (line 878) | function $UrlMatcherFactory() {
  function $UrlRouterProvider (line 935) | function $UrlRouterProvider(  $urlMatcherFactory) {
  function $StateProvider (line 1216) | function $StateProvider(   $urlRouterProvider,   $urlMatcherFactory,    ...
  function $ViewProvider (line 2400) | function $ViewProvider() {
  function $ViewScrollProvider (line 2477) | function $ViewScrollProvider() {
  function $ViewDirective (line 2637) | function $ViewDirective(   $state,   $injector,   $uiViewScroll) {
  function $ViewDirectiveFill (line 2767) | function $ViewDirectiveFill ($compile, $controller, $state) {
  function parseStateRef (line 2814) | function parseStateRef(ref) {
  function stateContext (line 2820) | function stateContext(el) {
  function $StateRefDirective (line 2891) | function $StateRefDirective($state, $timeout) {
  function $StateActiveDirective (line 3003) | function $StateActiveDirective($state, $stateParams, $interpolate) {
  function $IsStateFilter (line 3051) | function $IsStateFilter($state) {
  function $IncludedByStateFilter (line 3067) | function $IncludedByStateFilter($state) {
  function $RouteProvider (line 3096) | function $RouteProvider(  $stateProvider,    $urlRouterProvider) {

FILE: works/js/lib/jquery.js
  function isArraylike (line 931) | function isArraylike( obj ) {
  function createOptions (line 954) | function createOptions( options ) {
  function internalData (line 1525) | function internalData( elem, name, data, pvt /* Internal Use Only */ ){
  function internalRemoveData (line 1619) | function internalRemoveData( elem, name, pvt /* For internal use only */ ){
  function dataAttr (line 1811) | function dataAttr( elem, key, data ) {
  function isEmptyDataObject (line 1843) | function isEmptyDataObject( obj ) {
  function returnTrue (line 2672) | function returnTrue() {
  function returnFalse (line 2676) | function returnFalse() {
  function isNative (line 3827) | function isNative( fn ) {
  function createCache (line 3837) | function createCache() {
  function markFunction (line 3855) | function markFunction( fn ) {
  function assert (line 3864) | function assert( fn ) {
  function Sizzle (line 3877) | function Sizzle( selector, context, results, seed ) {
  function siblingCheck (line 4439) | function siblingCheck( a, b ) {
  function createInputPseudo (line 4452) | function createInputPseudo( type ) {
  function createButtonPseudo (line 4460) | function createButtonPseudo( type ) {
  function createPositionalPseudo (line 4468) | function createPositionalPseudo( fn ) {
  function tokenize (line 4995) | function tokenize( selector, parseOnly ) {
  function toSelector (line 5062) | function toSelector( tokens ) {
  function addCombinator (line 5072) | function addCombinator( matcher, combinator, base ) {
  function elementMatcher (line 5122) | function elementMatcher( matchers ) {
  function condense (line 5136) | function condense( unmatched, map, filter, context, xml ) {
  function setMatcher (line 5157) | function setMatcher( preFilter, selector, matcher, postFilter, postFinde...
  function matcherFromTokens (line 5250) | function matcherFromTokens( tokens ) {
  function matcherFromGroupMatchers (line 5302) | function matcherFromGroupMatchers( elementMatchers, setMatchers ) {
  function multipleContexts (line 5428) | function multipleContexts( selector, contexts, results ) {
  function select (line 5437) | function select( selector, context, results, seed ) {
  function setFilters (line 5505) | function setFilters() {}
  function sibling (line 5657) | function sibling( cur, dir ) {
  function winnow (line 5765) | function winnow( elements, qualifier, keep ) {
  function createSafeFragment (line 5798) | function createSafeFragment( document ) {
  function findOrAppend (line 6184) | function findOrAppend( elem, tag ) {
  function disableScript (line 6189) | function disableScript( elem ) {
  function restoreScript (line 6194) | function restoreScript( elem ) {
  function setGlobalEval (line 6205) | function setGlobalEval( elems, refElements ) {
  function cloneCopyEvent (line 6213) | function cloneCopyEvent( src, dest ) {
  function fixCloneNodeIssues (line 6241) | function fixCloneNodeIssues( src, dest ) {
  function getAll (line 6334) | function getAll( context, tag ) {
  function fixDefaultChecked (line 6357) | function fixDefaultChecked( elem ) {
  function vendorPropName (line 6621) | function vendorPropName( style, name ) {
  function isHidden (line 6643) | function isHidden( elem, el ) {
  function showHide (line 6650) | function showHide( elements, show ) {
  function setPositiveNumber (line 6988) | function setPositiveNumber( elem, value, subtract ) {
  function augmentWidthOrHeight (line 6996) | function augmentWidthOrHeight( elem, name, extra, isBorderBox, styles ) {
  function getWidthOrHeight (line 7035) | function getWidthOrHeight( elem, name, extra ) {
  function css_defaultDisplay (line 7079) | function css_defaultDisplay( nodeName ) {
  function actualDisplay (line 7111) | function actualDisplay( name, doc ) {
  function buildParams (line 7337) | function buildParams( prefix, obj, traditional, add ) {
  function addToPrefiltersOrTransports (line 7421) | function addToPrefiltersOrTransports( structure ) {
  function inspectPrefiltersOrTransports (line 7453) | function inspectPrefiltersOrTransports( structure, options, originalOpti...
  function ajaxExtend (line 7480) | function ajaxExtend( target, src ) {
  function done (line 7943) | function done( status, nativeStatusText, responses, headers ) {
  function ajaxHandleResponses (line 8064) | function ajaxHandleResponses( s, jqXHR, responses ) {
  function ajaxConvert (line 8126) | function ajaxConvert( s, response ) {
  function createStandardXHR (line 8388) | function createStandardXHR() {
  function createActiveXHR (line 8394) | function createActiveXHR() {
  function createFxNow (line 8644) | function createFxNow() {
  function createTweens (line 8651) | function createTweens( animation, props ) {
  function Animation (line 8666) | function Animation( elem, properties, options ) {
  function propFilter (line 8770) | function propFilter( props, specialEasing ) {
  function defaultPrefilter (line 8837) | function defaultPrefilter( elem, props, opts ) {
  function Tween (line 8962) | function Tween( elem, options, prop, end, easing ) {
  function genFx (line 9188) | function genFx( type, includeWidth ) {
  function getWindow (line 9484) | function getWindow( elem ) {

FILE: works/js/lib/ui-bootstrap-tpls-0.11.0.js
  function findEndEventName (line 81) | function findEndEventName(endEventNames) {
  function doTransition (line 103) | function doTransition(change) {
  function expand (line 120) | function expand() {
  function expandDone (line 130) | function expandDone() {
  function collapse (line 136) | function collapse() {
  function collapseDone (line 153) | function collapseDone() {
  function getTrueValue (line 376) | function getTrueValue() {
  function getFalseValue (line 380) | function getFalseValue() {
  function getCheckboxValue (line 384) | function getCheckboxValue(attributeValue, defaultValue) {
  function goNext (line 438) | function goNext() {
  function transitionDone (line 470) | function transitionDone(next, current) {
  function restartTimer (line 510) | function restartTimer() {
  function resetTimer (line 518) | function resetTimer() {
  function timerFn (line 525) | function timerFn() {
  function isValid (line 813) | function isValid(year, month, date) {
  function getStyle (line 836) | function getStyle(el, cssprop) {
  function isStaticPositioned (line 850) | function isStaticPositioned(element) {
  function getDaysInMonth (line 1192) | function getDaysInMonth( year, month ) {
  function getDates (line 1196) | function getDates(startDate, n) {
  function getISO8601WeekNumber (line 1250) | function getISO8601WeekNumber(date) {
  function getStartingYear (line 1354) | function getStartingYear( year ) {
  function cameltoDash (line 1446) | function cameltoDash( string ){
  function parseDate (line 1470) | function parseDate(viewValue) {
  function backdropIndex (line 1879) | function backdropIndex() {
  function removeModalWindow (line 1896) | function removeModalWindow(modalInstance) {
  function checkRemoveBackdrop (line 1912) | function checkRemoveBackdrop() {
  function removeAfterAnimate (line 1925) | function removeAfterAnimate(domEl, scope, emulateTime, done) {
  function getTemplatePromise (line 2048) | function getTemplatePromise(options) {
  function getResolvePromises (line 2055) | function getResolvePromises(resolves) {
  function makePage (line 2260) | function makePage(number, text, isActive) {
  function getPages (line 2268) | function getPages(currentPage, totalPages) {
  function snake_case (line 2415) | function snake_case(name){
  function getTriggers (line 2445) | function getTriggers ( trigger ) {
  function toggleTooltipBind (line 2496) | function toggleTooltipBind () {
  function showTooltipBind (line 2505) | function showTooltipBind() {
  function hideTooltipBind (line 2521) | function hideTooltipBind () {
  function show (line 2528) | function show() {
  function hide (line 2569) | function hide() {
  function createTooltip (line 2589) | function createTooltip() {
  function removeTooltip (line 2600) | function removeTooltip() {
  function isTabHeading (line 3155) | function isTabHeading(node) {
  function getHoursFromTemplate (line 3233) | function getHoursFromTemplate ( ) {
  function getMinutesFromTemplate (line 3251) | function getMinutesFromTemplate() {
  function pad (line 3256) | function pad( value ) {
  function refresh (line 3357) | function refresh( keyboardChange ) {
  function makeValid (line 3363) | function makeValid() {
  function updateTemplate (line 3369) | function updateTemplate( keyboardChange ) {
  function addMinutes (line 3381) | function addMinutes( minutes ) {
  function escapeRegexp (line 3793) | function escapeRegexp(queryToEscape) {
Condensed preview — 833 files, each showing path, character count, and a content snippet. Download the .json file or copy for the full structured content (9,200K chars).
[
  {
    "path": ".gitignore",
    "chars": 99,
    "preview": "_site\n.DS_Store\n*.sublime-project\n*.sublime-workspace\ncodekit-config.json\nnode_modules\nGemfile.lock"
  },
  {
    "path": ".jshintrc",
    "chars": 325,
    "preview": "{\n  \"bitwise\": true,\n  \"browser\": true,\n  \"curly\": true,\n  \"eqeqeq\": true,\n  \"eqnull\": true,\n  \"es5\": false,\n  \"esnext\":"
  },
  {
    "path": ".project",
    "chars": 370,
    "preview": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<projectDescription>\n\t<name>github_blog</name>\n\t<comment></comment>\n\t<projects>\n\t"
  },
  {
    "path": "404.md",
    "chars": 445,
    "preview": "---\nlayout: page\ntitle: \"Page Not Found\"\ndescription: \"Page not found. Your pixels are in another canvas.\"\n---  \n\nSorry,"
  },
  {
    "path": "CNAME",
    "chars": 1,
    "preview": "\n"
  },
  {
    "path": "Gemfile",
    "chars": 129,
    "preview": "source 'https://rubygems.org'\n\ngem 'jekyll'\ngem 'kramdown'\ngem 'coderay'\ngem 'rake'\ngem 'thor'\ngem 'activesupport'\ngem '"
  },
  {
    "path": "Gruntfile.js",
    "chars": 2291,
    "preview": "'use strict';\nmodule.exports = function(grunt) {\n\n  grunt.initConfig({\n    jshint: {\n      options: {\n        jshintrc: "
  },
  {
    "path": "LICENSE",
    "chars": 1078,
    "preview": "The MIT License (MIT)\n\nCopyright (c) 2014 Michael Rose\n\nPermission is hereby granted, free of charge, to any person obta"
  },
  {
    "path": "README.md",
    "chars": 406,
    "preview": "个人前端博客\n----------\n\n## [点此访问 www.hacke2.cn](http://www.hacke2.cn)\n\n本博客是基于[hpstr jekyll](\"https://github.com/hacke2/hpstr-"
  },
  {
    "path": "Rakefile.rb",
    "chars": 2665,
    "preview": "require \"rubygems\"\nrequire \"bundler/setup\"\nrequire \"stringex\"\n\n## -- Config -- ##\n\npublic_dir      = \"public\"    # compi"
  },
  {
    "path": "_config.yml",
    "chars": 2196,
    "preview": "title:            hacke2's blog\ndescription:      hacke2的前端技术博客,分享自己的技术心得,积累前段技能,汇聚前端之路的点点滴滴。\ndisqus_shortname: hacke2\nr"
  },
  {
    "path": "_includes/browser-upgrade.html",
    "chars": 203,
    "preview": "<!--[if lt IE 9]><div class=\"upgrade\"><strong><a href=\"http://whatbrowser.org/\">Your browser is quite old!</strong> Why "
  },
  {
    "path": "_includes/disqus_comments.html",
    "chars": 1187,
    "preview": "<script type=\"text/javascript\">\n    /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */\n    var"
  },
  {
    "path": "_includes/footer.html",
    "chars": 534,
    "preview": "<span>&copy; {{ site.time | date: '%Y' }} {{ site.owner.name }}. Powered by <a href=\"http://jekyllrb.com\">Jekyll</a> usi"
  },
  {
    "path": "_includes/head.html",
    "chars": 4370,
    "preview": "<meta charset=\"utf-8\">\n<title>{% if page.title %}{{ page.title }} &#8211; {% endif %}{{ site.title }}</title>\n<meta name"
  },
  {
    "path": "_includes/navigation.html",
    "chars": 2628,
    "preview": "<nav id=\"dl-menu\" class=\"dl-menuwrapper\" role=\"navigation\">\n\t<button class=\"dl-trigger\">Open Menu</button>\n\t<ul class=\"d"
  },
  {
    "path": "_includes/scripts.html",
    "chars": 1253,
    "preview": "<script src=\"//libs.baidu.com/jquery/1.9.0/jquery.js\"></script>\n<!--<script>window.jQuery || document.write('<script src"
  },
  {
    "path": "_layouts/page.html",
    "chars": 3182,
    "preview": "<!doctype html>\n<!--[if lt IE 7]><html class=\"no-js lt-ie9 lt-ie8 lt-ie7\" lang=\"en\"> <![endif]-->\n<!--[if (IE 7)&!(IEMob"
  },
  {
    "path": "_layouts/post-index.html",
    "chars": 2021,
    "preview": "<!doctype html>\n<!--[if lt IE 7]><html class=\"no-js lt-ie9 lt-ie8 lt-ie7\" lang=\"en\"> <![endif]-->\n<!--[if (IE 7)&!(IEMob"
  },
  {
    "path": "_layouts/post.html",
    "chars": 5114,
    "preview": "<!doctype html>\n<!--[if lt IE 7]><html class=\"no-js lt-ie9 lt-ie8 lt-ie7\" lang=\"en\"> <![endif]-->\n<!--[if (IE 7)&!(IEMob"
  },
  {
    "path": "_posts/2014-10-1-for-me-1.html",
    "chars": 2297,
    "preview": "<!DOCTYPE html>\n<html>\n\n\t<head>\n\t\t<meta charset=\"utf-8\">\n\t\t<title>致自己</title>\n\t\t<style>\n\t\t\tbody {\n\t\t\t\tmargin: 0;\n\t\t\t\tpad"
  },
  {
    "path": "_posts/2014-10-1-mongoose-populate.md",
    "chars": 2413,
    "preview": "---\nlayout: post\ntitle: Mongoose简单的连表查询\ndescription: \"使用populate属性\"\ntags: [Mongoose]\nimage:\n  background: witewall_3.png"
  },
  {
    "path": "_posts/2014-10-11-the-golden-key.md",
    "chars": 735,
    "preview": "---\nlayout: post\ntitle: 金钥匙\ndescription: \"记这两周的起起伏伏\"\ntags: [心情]\nimage:\n  background: witewall_3.png\ncomments: true\nshare"
  },
  {
    "path": "_posts/2014-10-14-links-share-2014-10-14.md",
    "chars": 728,
    "preview": "---\nlayout: post\ntitle: 前端资源分享\ndescription: \"分享一些前端、知乎、行业文章、有些工具资源等\"\ntags: [前端资源分享]\nimage:\n  background: witewall_3.png\n"
  },
  {
    "path": "_posts/2014-10-2-great-nodejs.md",
    "chars": 5472,
    "preview": "---\nlayout: post\ntitle: 了不起的Node.js读书笔记\ndescription: \"一般结构和思路特别清晰的Node.js入门书籍\"\ntags: [读书笔记, Node.js]\nimage:\n  background"
  },
  {
    "path": "_posts/2014-10-20-tink-in-Ghostjs.md",
    "chars": 2763,
    "preview": "---\nlayout: post\ntitle: GhostJs源码目录\ndescription: \"GhostJs源码的学习\"\ntags: [JavaScript]\nimage:\n  background: witewall_3.png\nc"
  },
  {
    "path": "_posts/2014-10-22-html5-javascript-web-dep.md",
    "chars": 7429,
    "preview": "---\nlayout: post\ntitle: HTML5和JavaScript Web应用开发读书笔记\ndescription: \"《HTML5和JavaScript Web应用开发》主要介绍如何使用HTML5、JavaScript和最新"
  },
  {
    "path": "_posts/2014-10-29-2014-10-d2.md",
    "chars": 3343,
    "preview": "---\nlayout: post\ntitle: 2014.10.25 杭州D2行\ndescription: \"2014.10.25 杭州D2行\"\ntags: [游记]\nimage:\n  background: witewall_3.png\n"
  },
  {
    "path": "_posts/2014-10-3-node-westom-mina.md",
    "chars": 3310,
    "preview": "---\nlayout: post\ntitle: 利用Node.js对某智能家居服务器重构\ndescription: \"利用Node.js天生NIO特性\"\ntags: [Mongoose]\nimage:\n  background: witew"
  },
  {
    "path": "_posts/2014-10-31-es6-modules-today-with-6to5.md",
    "chars": 3924,
    "preview": "---\nlayout: post\ntitle: 译-使用6to5,让今天就来写ES6的模块化开发!\ndescription: \"ES6 modules today with 6to5\"\ntags: [翻译]\nimage:\n  backgro"
  },
  {
    "path": "_posts/2014-11-10-javascript-aop.md",
    "chars": 4649,
    "preview": "---\nlayout: post\ntitle: 简单几行代码,实现JavaScript中的AOP\ndescription: \"JavaScript中的AOP的模拟与实现\"\ntags: [JavaScript]\nimage:\n  backgr"
  },
  {
    "path": "_posts/2014-11-11-hello-mobile-aop.md",
    "chars": 5461,
    "preview": "---\nlayout: post\ntitle: 移动Web初级入门\ndescription: \"入门移动Web的一些思考\"\ntags: [移动Web]\nimage:\n  background: witewall_3.png\ncomments"
  },
  {
    "path": "_posts/2014-11-12-create-github-page.md",
    "chars": 1529,
    "preview": "---\nlayout: post\ntitle: 30秒搭建Github Page\ndescription: \"30秒创建和我一样的Github博客\"\ntags: [分享]\nimage:\n  background: witewall_3.pn"
  },
  {
    "path": "_posts/2014-11-14-answer-how-to-prepare.md",
    "chars": 1410,
    "preview": "---\nlayout: post\ntitle: 还有一年时间,该如何准备?\ndescription: \"回答群友问题\"\ntags: [问答]\nimage:\n  background: witewall_3.png\ncomments: tru"
  },
  {
    "path": "_posts/2014-11-18-about-responsive.md",
    "chars": 6480,
    "preview": "---\nlayout: post\ntitle: 响应式Web初级入门\ndescription: \"关于响应式编程的一些思考\"\ntags: [移动Web]\nimage:\n  background: witewall_3.png\ncomment"
  },
  {
    "path": "_posts/2014-11-30-gugong.md",
    "chars": 2136,
    "preview": "---\nlayout: post\ntitle: 故宫&国家博物馆之行\ndescription: \"北京第一站游记\"\ntags: [游记]\nimage:\n  background: witewall_3.png\ncomments: true\n"
  },
  {
    "path": "_posts/2014-11-8-arrow-functions-and-their-scope.md",
    "chars": 7137,
    "preview": "---\nlayout: post\ntitle: 译-ES6箭头函数和它的作用域\ndescription: \"关于ES6里箭头函数及其作用域的使用\"\ntags: [翻译]\nimage:\n  background: witewall_3.png"
  },
  {
    "path": "_posts/2014-12-2-fe-cut-image.md",
    "chars": 2001,
    "preview": "---\nlayout: post\ntitle: 实习初体验之前端切图\ndescription: \"前端切图的一些小技巧\"\ntags: [PS]\nimage:\n  background: witewall_3.png\ncomments: tr"
  },
  {
    "path": "_posts/2014-12-8-my-university-experience.md",
    "chars": 1217,
    "preview": "---\nlayout: post\ntitle: 给学弟学妹说的话\ndescription: \"我的大学经历\"\ntags: [感悟]\nimage:\n  background: witewall_3.png\ncomments: true\nsha"
  },
  {
    "path": "_posts/2014-8-29-hello-memory-leak.md",
    "chars": 3033,
    "preview": "---\nlayout: post\ntitle: JavaScript内存泄漏\ndescription: \"进入WEB 2.0 时代,js人们对Web应用有了高更的要求.一个页面很可能数小时不会发生URL跳转,并同时通过Web服务动态的更新页"
  },
  {
    "path": "_posts/2014-8-29-web-development-process.md",
    "chars": 3688,
    "preview": "---\nlayout: post\ntitle: 高大上Web前端开发环境\ndescription: \"前几天做阿里笔试题,最后一个问题是:在前端开发中,经常会遇到调用后端接口的情况,如果我们不想依赖后台的开发环境,比如:本地搭建熟悉的环境,"
  },
  {
    "path": "_posts/2014-8-31-javascript-quiz.md",
    "chars": 3030,
    "preview": "---\nlayout: post\ntitle: Javascript Quiz\ndescription: \"Javascript Quiz 练习题解析\"\ntags: [JavaScript]\nimage:\n  background: wit"
  },
  {
    "path": "_posts/2014-9-1-cqut-paging.md",
    "chars": 2439,
    "preview": "---\nlayout: post\ntitle: JavaScript模仿实验室分页组件\ndescription: \"实验室分页组件,一个简单的分页,非AJAX局部刷新\"\ntags: [小练习, JavaScript]\nimage:\n  ba"
  },
  {
    "path": "_posts/2014-9-1-oschina-angularjs.md",
    "chars": 7577,
    "preview": "---\nlayout: post\ntitle: 开源中国的 AngularJS 优秀文章汇总\ndescription: \"在开源中国看到的,每一篇都是精华\"\ntags: [小练习, JavaScript]\nimage:\n  backgrou"
  },
  {
    "path": "_posts/2014-9-10-level-img-change.md",
    "chars": 2432,
    "preview": "---\nlayout: post\ntitle: 带层次感的图片轮播\ndescription: \"带层次感的图片轮播,JavaScript小练习\"\ntags: [JavaScript, 小练习]\nimage:\n  background: wi"
  },
  {
    "path": "_posts/2014-9-11-nodeJS-char.md",
    "chars": 3256,
    "preview": "---\nlayout: post\ntitle: 基于Node.js + socket.io实现WebSocket的聊天DEMO\ndescription: \"WebSocket Node.js实现版\"\ntags: [JavaScript, N"
  },
  {
    "path": "_posts/2014-9-12-css3-lenove.md",
    "chars": 4640,
    "preview": "---\nlayout: post\ntitle: JavaScript实现联想校招员工信息展示\ndescription: \"使用简单模板+css3+javascript实现CSS3弹窗及切换\"\ntags: [JavaScript, 小练习]\n"
  },
  {
    "path": "_posts/2014-9-18-no-sleep.md",
    "chars": 908,
    "preview": "---\nlayout: post\ntitle: 夜未眠\ndescription: \"找工作这几天的心声\"\ntags: [心声]\nimage:\n  background: witewall_3.png\ncomments: true\nshare"
  },
  {
    "path": "_posts/2014-9-2-what-happens-when-you-type-in-a-url-in-browser.md",
    "chars": 2191,
    "preview": "---\nlayout: post\ntitle: 从输入 URL 到页面加载完成的过程中都发生了什么事情?\ndescription: \"what happens when you type in a url in browser,对stack"
  },
  {
    "path": "_posts/2014-9-26-div-center.md",
    "chars": 2005,
    "preview": "---\nlayout: post\ntitle: CSS居中完全解决方案\ndescription: \"各种情景下的CSS水平垂直居中\"\ntags: [CSS]\nimage:\n  background: witewall_3.png\ncomme"
  },
  {
    "path": "_posts/2014-9-26-think-in-seo.md",
    "chars": 2176,
    "preview": "---\nlayout: post\ntitle: 和我一起来了解SEO\ndescription: \"前端工程师必备的SEO知识\"\ntags: [SEO]\nimage:\n  background: witewall_3.png\ncomments"
  },
  {
    "path": "_posts/2014-9-28-gokk.md",
    "chars": 2079,
    "preview": "---\nlayout: post\ntitle: 基于Node.js + jade + Mongoose  模仿gokk.tv \ndescription: \"向goxiazai致敬\"\ntags: [Node.js]\nimage:\n  back"
  },
  {
    "path": "_posts/2014-9-30-nodeJS-sublime-3.md",
    "chars": 1351,
    "preview": "---\nlayout: post\ntitle: 在Sublime Text3 开发Node.js遇到的一个小问题\ndescription: \"主要解决了重新运行端口占用的情况\"\ntags: [Node.js]\nimage:\n  backgr"
  },
  {
    "path": "_posts/2014-9-4-javascript-seamless-handover.md",
    "chars": 978,
    "preview": "---\nlayout: post\ntitle: JavaScript打造无缝切换\ndescription: \"用JavaScrip写的无缝切换,弥补一年前的遗憾\"\ntags: [JavaScript, 小练习]\nimage:\n  backg"
  },
  {
    "path": "_posts/2014-9-4-my-show-4-angularjs.md",
    "chars": 1099,
    "preview": "---\nlayout: post\ntitle: AngularJs+BootStarp+fontAwesome打造个人展示页面\ndescription: \"简单的个人展示的界面\"\ntags: [JavaScript, AngularJs, "
  },
  {
    "path": "_posts/2015-1-13-what-you-need-to-know-about-block-scope-let.md",
    "chars": 1724,
    "preview": "---\nlayout: post\ntitle: 译-你需要知道的块级作用域 - let\ndescription: \"JavaScript 未来声明变量的方式\"\ntags: [翻译]\nimage:\n  background: witewall"
  },
  {
    "path": "_posts/2015-1-14-2015-plan.md",
    "chars": 1184,
    "preview": "---\nlayout: post\ntitle: 该是做做计划的时候了!\ndescription: \"2015年计划\"\ntags: [翻译]\nimage:\n  background: witewall_3.png\ncomments: true"
  },
  {
    "path": "_posts/2015-10-21-scroll-in-uc.md",
    "chars": 2946,
    "preview": "---\nlayout: post\ntitle: 在移动端上使用原生滑屏解决方案\ndescription: \"解决UC左右滑动BUG\"\ntags: [Mobile Web]\nimage:\n  background: witewall_3.pn"
  },
  {
    "path": "_posts/2015-10-9-javascript-iterables-and-iterators.md",
    "chars": 11252,
    "preview": "---\nlayout: post\ntitle: 译-Javascript中的Iterables和Iterators\ndescription: \"ES6迭代器介绍\"\ntags: [Javascript, ES6]\nimage:\n  backg"
  },
  {
    "path": "_posts/2015-11-17-use-node-build-static-blog.md",
    "chars": 7138,
    "preview": "---\nlayout: post\ntitle: 使用Node.js生成一个静态博客\ndescription: \"静态博客wooden编写记录\"\ntags: [Node,Javascript, ES6]\nimage:\n  background"
  },
  {
    "path": "_posts/2015-2-25-Variables-and-scoping-in-ECMAScript-6.md",
    "chars": 5629,
    "preview": "---\nlayout: post\ntitle: 译-ES6里的变量和作用域\ndescription: \"在ES6中变量和作用域的使用方法\"\ntags: [翻译]\nimage:\n  background: witewall_3.png\ncom"
  },
  {
    "path": "_posts/2015-3-13-anmi-strange-problem.md",
    "chars": 1268,
    "preview": "---\nlayout: post\ntitle: Zepto CSS方法一个奇怪的现象\ndescription: \"Zepto CSS方法一个奇怪的现象\"\ntags: [心声]\nimage:\n  background: witewall_3."
  },
  {
    "path": "_posts/2015-3-20-css-multi-row-overflow.md",
    "chars": 1357,
    "preview": "---\nlayout: post\ntitle: 小tip:CSS3控制多行溢出\ndescription: \"打破CSS只能控制单行溢出的历史观点\"\ntags: [CSS3]\nimage:\n  background: witewall_3.p"
  },
  {
    "path": "_posts/2015-3-23-frame-animation.md",
    "chars": 4483,
    "preview": "---\nlayout: post\ntitle: 逐帧动画两种实现方式\ndescription: \"分别用JS/CSS实现逐帧动画\"\ntags: [CSS3]\nimage:\n  background: witewall_3.png\ncomme"
  },
  {
    "path": "_posts/2015-3-4-to-teacher.md",
    "chars": 1680,
    "preview": "---\nlayout: post\ntitle: 给老师的一些课程主题\ndescription: \"前端课程的参考主题\"\ntags: [翻译]\nimage:\n  background: witewall_3.png\ncomments: tru"
  },
  {
    "path": "_posts/2015-3-7-share-jsbin.md",
    "chars": 2210,
    "preview": "---\nlayout: post\ntitle: 我在jsbin里存的好东西\ndescription: \"在jsbin里存的一些代码片段\"\ntags: [心声]\nimage:\n  background: witewall_3.png\ncomm"
  },
  {
    "path": "_posts/2015-5-18-how-i-m-using-es6-modules-in-production.md",
    "chars": 3094,
    "preview": "---\nlayout: post\ntitle: 译-我是怎么在项目中使用ES6模块化的\ndescription: \"如何让ES6 module 和 AMD module一起工作\"\ntags: [ES6]\nimage:\n  backgroun"
  },
  {
    "path": "_posts/2015-9-16-express-node-act.md",
    "chars": 277,
    "preview": "---\nlayout: post\ntitle: express介绍及实战\ndescription: \"神马前端9月新人分享\"\ntags: [分享]\nimage:\n  background: witewall_3.png\ncomments: "
  },
  {
    "path": "_posts/2016-1-1-review-2015.md",
    "chars": 1964,
    "preview": "---\nlayout: post\ntitle: 2015年终小结\ndescription: \"2015回顾\"\ntags: [Javascript, ES6]\nimage:\n  background: witewall_3.png\ncomme"
  },
  {
    "path": "_posts/2016-2-1-configuring-babel-6-for-node-js.md",
    "chars": 5094,
    "preview": "---\nlayout: post\ntitle: 译-为你的Node.js配置babel 6\ndescription: \"babel 6基础教程\"\ntags: [Node.js, ES6]\nimage:\n  background: witew"
  },
  {
    "path": "_posts/2016-6-19-think-in-react-redux-1.md",
    "chars": 2837,
    "preview": "---\nlayout: post\ntitle: React + Redux 入门(一):抛开 React 学 Redux\ndescription: \"redux 入门\"\ntags: [Redux, React]\nimage:\n  backg"
  },
  {
    "path": "_posts/2017-01-22-review-2016.md",
    "chars": 1191,
    "preview": "---\nlayout: post\ntitle: 2017 is Comming\ndescription: \"致已经逝去的2016和即将到来的2017\"\ntags: [心路历程]\nimage:\n  background: witewall_3"
  },
  {
    "path": "about.md",
    "chars": 581,
    "preview": "---\nlayout: page\npermalink: /about/\ntitle: About Me\ntags: [about]\nimage:\n  feature: abstract-12.jpg\ncomments: true\nshare"
  },
  {
    "path": "assets/assets/js/plugins/jquery.dlmenu.js",
    "chars": 7031,
    "preview": "/**\n * jquery.dlmenu.js v1.0.1\n * http://www.codrops.com\n *\n * Licensed under the MIT license.\n * http://www.opensource."
  },
  {
    "path": "assets/assets/js/plugins/jquery.fitvids.js",
    "chars": 2915,
    "preview": "/*global jQuery */\n/*jshint multistr:true, browser:true */\n/*!\n* FitVids 1.0\n*\n* Copyright 2011, Chris Coyier - http://c"
  },
  {
    "path": "assets/assets/js/plugins/jquery.magnific-popup.js",
    "chars": 45280,
    "preview": "/*! Magnific Popup - v0.9.3 - 2013-07-16\n* http://dimsemenov.com/plugins/magnific-popup/\n* Copyright (c) 2013 Dmitry Sem"
  },
  {
    "path": "assets/css/main.css",
    "chars": 79201,
    "preview": "/*! \n// ===========================================================\n// HPSTR Jekyll Theme\n// By: Michael Rose\n// ======="
  },
  {
    "path": "assets/js/_main.js",
    "chars": 1334,
    "preview": "/*! Plugin options and other jQuery stuff */\n\n// dl-menu options\n$(function() {\n  $( '#dl-menu' ).dlmenu({\n    animation"
  },
  {
    "path": "assets/js/plugins/jquery.dlmenu.js",
    "chars": 7031,
    "preview": "/**\n * jquery.dlmenu.js v1.0.1\n * http://www.codrops.com\n *\n * Licensed under the MIT license.\n * http://www.opensource."
  },
  {
    "path": "assets/js/plugins/jquery.fitvids.js",
    "chars": 2915,
    "preview": "/*global jQuery */\n/*jshint multistr:true, browser:true */\n/*!\n* FitVids 1.0\n*\n* Copyright 2011, Chris Coyier - http://c"
  },
  {
    "path": "assets/js/plugins/jquery.magnific-popup.js",
    "chars": 45280,
    "preview": "/*! Magnific Popup - v0.9.3 - 2013-07-16\n* http://dimsemenov.com/plugins/magnific-popup/\n* Copyright (c) 2013 Dmitry Sem"
  },
  {
    "path": "assets/js/plugins/respond.js",
    "chars": 9747,
    "preview": "/*! matchMedia() polyfill - Test a CSS media type/query in JS. Authors & copyright (c) 2012: Scott Jehl, Paul Irish, Nic"
  },
  {
    "path": "assets/less/coderay.less",
    "chars": 1667,
    "preview": ".CodeRay {\n  font-family: @code-font;\n  .font(12);\n  color: #d0d0d0;\n  margin-bottom: 1.5em;\n  .rounded(3px);\n}\n\n.CodeRa"
  },
  {
    "path": "assets/less/dl-menu.less",
    "chars": 6862,
    "preview": ".dl-menuwrapper {\n\twidth: 100%;\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\tz-index: 1000;\n\t-webkit-perspective: 1000px;\n\t-"
  },
  {
    "path": "assets/less/elements.less",
    "chars": 7858,
    "preview": "hr { \n    display: block; \n    margin: 1em 0; \n    padding: 0;\n    height: 1px; \n    border: 0; \n    border-top: 1px sol"
  },
  {
    "path": "assets/less/font-awesome/bordered-pulled.less",
    "chars": 330,
    "preview": "// Bordered & Pulled\n// -------------------------\n\n.@{fa-css-prefix}-border {\n  padding: .2em .25em .15em;\n  border: sol"
  },
  {
    "path": "assets/less/font-awesome/core.less",
    "chars": 270,
    "preview": "// Base Class Definition\n// -------------------------\n\n.@{fa-css-prefix} {\n  display: inline-block;\n  font-family: FontA"
  },
  {
    "path": "assets/less/font-awesome/fixed-width.less",
    "chars": 119,
    "preview": "// Fixed Width Icons\n// -------------------------\n.@{fa-css-prefix}-fw {\n  width: (18em / 14);\n  text-align: center;\n}\n"
  },
  {
    "path": "assets/less/font-awesome/font-awesome.less",
    "chars": 465,
    "preview": "/*!\n *  Font Awesome 4.1.0 by @davegandy - http://fontawesome.io - @fontawesome\n *  License - http://fontawesome.io/lice"
  },
  {
    "path": "assets/less/font-awesome/icons.less",
    "chars": 31652,
    "preview": "/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen\n   readers do not read off random characters th"
  },
  {
    "path": "assets/less/font-awesome/larger.less",
    "chars": 370,
    "preview": "// Icon Sizes\n// -------------------------\n\n/* makes the font 33% larger relative to the icon container */\n.@{fa-css-pre"
  },
  {
    "path": "assets/less/font-awesome/list.less",
    "chars": 375,
    "preview": "// List Icons\n// -------------------------\n\n.@{fa-css-prefix}-ul {\n  padding-left: 0;\n  margin-left: @fa-li-width;\n  lis"
  },
  {
    "path": "assets/less/font-awesome/mixins.less",
    "chars": 699,
    "preview": "// Mixins\n// --------------------------\n\n.fa-icon-rotate(@degrees, @rotation) {\n  filter: progid:DXImageTransform.Micros"
  },
  {
    "path": "assets/less/font-awesome/path.less",
    "chars": 699,
    "preview": "/* FONT PATH\n * -------------------------- */\n\n@font-face {\n  font-family: 'FontAwesome';\n  src: ~\"url('@{fa-font-path}/"
  },
  {
    "path": "assets/less/font-awesome/rotated-flipped.less",
    "chars": 367,
    "preview": "// Rotated & Flipped Icons\n// -------------------------\n\n.@{fa-css-prefix}-rotate-90  { .fa-icon-rotate(90deg, 1);  }\n.@"
  },
  {
    "path": "assets/less/font-awesome/spinning.less",
    "chars": 749,
    "preview": "// Spinning Icons\n// --------------------------\n\n.@{fa-css-prefix}-spin {\n  -webkit-animation: spin 2s infinite linear;\n"
  },
  {
    "path": "assets/less/font-awesome/stacked.less",
    "chars": 476,
    "preview": "// Stacked Icons\n// -------------------------\n\n.@{fa-css-prefix}-stack {\n  position: relative;\n  display: inline-block;\n"
  },
  {
    "path": "assets/less/font-awesome/variables.less",
    "chars": 14257,
    "preview": "// Variables\n// --------------------------\n\n@fa-font-path:        \"//netdna.bootstrapcdn.com/font-awesome/4.1.0/fonts\"; "
  },
  {
    "path": "assets/less/font-awesome.less",
    "chars": 465,
    "preview": "/*!\n *  Font Awesome 4.1.0 by @davegandy - http://fontawesome.io - @fontawesome\n *  License - http://fontawesome.io/lice"
  },
  {
    "path": "assets/less/gist.less",
    "chars": 2463,
    "preview": ".gist {\n\n  .highlight {\n    color:#000;\n  }\n\n  .render-container .render-viewer-error,\n  .render-container .render-viewe"
  },
  {
    "path": "assets/less/grid.less",
    "chars": 1016,
    "preview": "// Defining number of columns in the grid.\n// Common Values would be 12, 16 or 24\n@width: 100%;\n@def_grid: 12;\n@margin: "
  },
  {
    "path": "assets/less/magnific-popup.less",
    "chars": 8413,
    "preview": "/* Magnific Popup CSS */\n// Modified by Michael Rose\n\n.mfp-bg {\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  z-"
  },
  {
    "path": "assets/less/main.less",
    "chars": 1507,
    "preview": "/*! \n// ===========================================================\n// HPSTR Jekyll Theme\n// By: Michael Rose\n// ======="
  },
  {
    "path": "assets/less/mixins.less",
    "chars": 9525,
    "preview": "// UTILITY MIXINS\n// --------------------------------------------------\n\n// Clearfix\n// --------------------\n// For clea"
  },
  {
    "path": "assets/less/page.less",
    "chars": 6994,
    "preview": "body {\n\tmargin: 0;\n\tpadding: 0;\n\twidth: 100%;\n\tbackground-color: @body-color;\n}\n\n// Main\n// ----------------------------"
  },
  {
    "path": "assets/less/pygments.less",
    "chars": 3004,
    "preview": ".highlight {\n\tmargin-bottom: 1.5em;\n\t.font(12);\n\tcolor: #d0d0d0;\n\tborder: 1px solid darken(@body-color, 5);\n\tbackground-"
  },
  {
    "path": "assets/less/reset.less",
    "chars": 4368,
    "preview": "//\n// Reset CSS\n// Adapted from http://github.com/necolas/normalize.css\n// ---------------------------------------------"
  },
  {
    "path": "assets/less/site.less",
    "chars": 909,
    "preview": "// Selection\n// --------------------------------------------------\n::-moz-selection { \n\tbackground-color: lighten(@base-"
  },
  {
    "path": "assets/less/typography.less",
    "chars": 2050,
    "preview": "// Body\n// --------------------------------------------------\nbody {\n\tfont-family: @base-font;\n\tcolor: @text-color;\n}\n\n/"
  },
  {
    "path": "assets/less/variables.less",
    "chars": 808,
    "preview": "// Typography\n// --------------------------------------------------\n\n@base-font: 'Lato', Calibri, Arial, sans-serif;\n@he"
  },
  {
    "path": "common/js/ajax.js",
    "chars": 1329,
    "preview": "function Ajax(parametObject) {\n \n\tvar xhr, responseType, defineParam, method, url, data;\n\tdefineParam = {\n\t\tmethod : \"GE"
  },
  {
    "path": "common/js/startmove.js",
    "chars": 1199,
    "preview": "function startMove(obj, json, fnEnd) {\n\tif (obj.timer) {\n\t\tclearInterval(obj.timer);\n\t}\n\tobj.timer = setInterval(functio"
  },
  {
    "path": "common/js/test.js",
    "chars": 7,
    "preview": "test.js"
  },
  {
    "path": "demo/2014-11/ali-media.html",
    "chars": 1571,
    "preview": "<!DOCTYPE html>\n<html>\n<head>\n  <meta charset=\"utf-8\">\n  <title>JS Bin</title>\n</head>\n<style type=\"text/css\">\n\t*{\n\t\tmar"
  },
  {
    "path": "demo/2014-11/ali-percent.html",
    "chars": 1255,
    "preview": "<!DOCTYPE html>\n<html>\n<head>\n  <meta charset=\"utf-8\">\n  <title>流式布局</title>\n</head>\n<style type=\"text/css\">\n\t*{\n\t\tmargi"
  },
  {
    "path": "demo/2014-11/ali-px.html",
    "chars": 1236,
    "preview": "<!DOCTYPE html>\n<html>\n<head>\n  <meta charset=\"utf-8\">\n  <title>JS Bin</title>\n</head>\n<style type=\"text/css\">\n\t*{\n\t\tmar"
  },
  {
    "path": "demo/2014-11/ali-rem.html",
    "chars": 1279,
    "preview": "<!DOCTYPE html>\n<html>\n<head>\n  <meta charset=\"utf-8\">\n  <title>弹性布局</title>\n</head>\n<style type=\"text/css\">\n\t*{\n\t\tmargi"
  },
  {
    "path": "demo/absolute_percent.html",
    "chars": 1779,
    "preview": "<!DOCTYPE html>\n<html>\n<head>\n    <meta name=\"viewport\" content=\"width=device-width,minimum-scale=1.0,maximum-scale=1.0,"
  },
  {
    "path": "demo/cqut-paging/demo.html",
    "chars": 2750,
    "preview": "<!DOCTYPE HTML>\r\n<html>\r\n<head>\r\n<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\" />\r\n<title></title>\r"
  },
  {
    "path": "demo/css3/imocoo_2.html",
    "chars": 14121,
    "preview": "<!DOCTYPE HTML>\n<htmllang=\"en-US\">\n    <head>\n        <meta charset=\"UTF-8\">\n        <title>CSS3 Full Background Slider "
  },
  {
    "path": "demo/javascript-seamless-handover/css/main.css",
    "chars": 1032,
    "preview": ".wrap{ width:500px;font-size:22px; margin:20px auto 0; padding:40px 20px;}\n.list{ padding:0 60px;}\n.list li{list-style:d"
  },
  {
    "path": "demo/javascript-seamless-handover/css/reset.css",
    "chars": 1014,
    "preview": "*{ margin:0; padding:0;}\nbody{font:14px/1.125 Arial,Helvetica,sans-serif;background:#fff;}\ntable{border-collapse:collaps"
  },
  {
    "path": "demo/javascript-seamless-handover/index.html",
    "chars": 850,
    "preview": "<!DOCTYPE html>\n<html>\n<head>\n    <meta charset=\"utf-8\"/>\n    <title>test</title>\n    <link rel=\"stylesheet\" type=\"text/"
  },
  {
    "path": "demo/javascript-seamless-handover/slide/bd01.html",
    "chars": 7715,
    "preview": "<!DOCTYPE html>\n<html>\n\n\t<head>\n\t\t<meta charset=\"utf-8\" />\n\t\t<title>百度爱玩 - 图片轮换效果</title>\n\t\t<link rel=\"stylesheet\" type="
  },
  {
    "path": "demo/javascript-seamless-handover/slide/css/slide.css",
    "chars": 5531,
    "preview": "/* reset */\n*{ margin:0; padding:0;}\nbody{font:12px/1.125 Arial,Helvetica,sans-serif;background:#fff;}\ntable{border-coll"
  },
  {
    "path": "demo/javascript-seamless-handover/slide/js/startmove.js",
    "chars": 1160,
    "preview": "function startMove(obj, json, fnEnd) {\n\tif (obj.timer) {\n\t\tclearInterval(obj.timer);\n\t}\n\tobj.timer = setInterval(functio"
  },
  {
    "path": "demo/js-template/demo.html",
    "chars": 1402,
    "preview": "<!DOCTYPE html>\n<html>\n\t<head>\n\t\t<meta charset=\"utf-8\">\n\t\t<title>Js模板引擎</title>\n\t</head>\n\t<body>\n\t\t<div id=\"tmp\">\n\t\t\t<di"
  },
  {
    "path": "demo/mobile/position/absolute.html",
    "chars": 2204,
    "preview": "<!DOCTYPE html>\n<html>\n<head>\n  <meta charset=\"utf-8\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-sca"
  },
  {
    "path": "demo/mobile/position/flex.html",
    "chars": 2047,
    "preview": "<!DOCTYPE html>\n<html>\n<head>\n  <meta charset=\"utf-8\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-sca"
  },
  {
    "path": "demo/mobile/position/reset.css",
    "chars": 2906,
    "preview": ".clearfix:before,.clearfix:after{content:\"\";display:table}.clearfix:after{clear:both}html,body{height:100%}html{font-fam"
  },
  {
    "path": "demo/my-show-4-angularjs/index.html",
    "chars": 1106,
    "preview": "<!DOCTYPE html>\n<html ng-app=\"project-show\">\n<head>\n  <meta charset=\"utf-8\">\n  <link href=\"http://libs.baidu.com/bootst"
  },
  {
    "path": "demo/my-show-4-angularjs/index.js",
    "chars": 1069,
    "preview": "\r\n//将路由注入进来\r\nvar projectShowApp= angular.module('project-show', ['ngRoute']);\r\n \r\n//配置路由\r\nprojectShowApp.config(functio"
  },
  {
    "path": "demo/my-show-4-angularjs/js/angular-1.3.0.js",
    "chars": 803279,
    "preview": "/**\n * @license AngularJS v1.3.0-beta.10\n * (c) 2010-2014 Google, Inc. http://angularjs.org\n * License: MIT\n */\n(functio"
  },
  {
    "path": "demo/my-show-4-angularjs/js/angular-animate.js",
    "chars": 81627,
    "preview": "/**\n * @license AngularJS v1.3.0-beta.14\n * (c) 2010-2014 Google, Inc. http://angularjs.org\n * License: MIT\n */\n(functio"
  },
  {
    "path": "demo/my-show-4-angularjs/js/angular-route.js",
    "chars": 33053,
    "preview": "/**\n * @license AngularJS v1.3.0-beta.14\n * (c) 2010-2014 Google, Inc. http://angularjs.org\n * License: MIT\n */\n(functio"
  },
  {
    "path": "demo/my-show-4-angularjs/js/angular-ui-router.js",
    "chars": 116474,
    "preview": "/**\n * State-based routing for AngularJS\n * @version v0.2.10\n * @link http://angular-ui.github.com/\n * @license MIT Lice"
  },
  {
    "path": "demo/my-show-4-angularjs/js/ui-bootstrap-tpls-0.11.0.js",
    "chars": 139268,
    "preview": "/*\n * angular-ui-bootstrap\n * http://angular-ui.github.io/bootstrap/\n\n * Version: 0.11.0 - 2014-05-01\n * License: MIT\n *"
  },
  {
    "path": "demo/my-show-4-angularjs/pages/about.html",
    "chars": 118,
    "preview": "<!-- about.html -->\r\n<div class=\"jumbotron text-center\">\r\n    <h1>About Page</h1>\r\n \r\n    <p>{{ message }}</p>\r\n</div>"
  },
  {
    "path": "demo/my-show-4-angularjs/pages/contact.html",
    "chars": 122,
    "preview": "<!-- contact.html -->\r\n<div class=\"jumbotron text-center\">\r\n    <h1>Contact Page</h1>\r\n \r\n    <p>{{ message }}</p>\r\n</di"
  },
  {
    "path": "demo/my-show-4-angularjs/pages/home.html",
    "chars": 153,
    "preview": "<!-- home.html -->\r\n<div class=\"jumbotron text-center\">\r\n    <h2>{{message.name}}</h2>\r\n \t<h2>{{message.mail}}</h2>\r\n   "
  },
  {
    "path": "demo/my-show-4-angularjs/pages/project.html",
    "chars": 118,
    "preview": "\r\n<div class=\"jumbotron text-center\">\r\n    <h2>项目名称:{{ project.name }}</h2>\r\n \r\n    <p>{{ project.other }}</p>\r\n</div>"
  },
  {
    "path": "feed.xml",
    "chars": 1657,
    "preview": "---\nlayout: none\n---\n<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<feed xmlns=\"http://www.w3.org/2005/Atom\" xml:lang=\"en\">\n<ti"
  },
  {
    "path": "index.html",
    "chars": 3145,
    "preview": "---\nlayout: post-index\ntitle: hacke2's blog | WEB前端,一路前行\ndescription: \"hacke2的前端技术博客,分享自己的技术心得,积累前段技能,汇聚前端之路的点点滴滴。\"\ntags"
  },
  {
    "path": "monthly/index.html",
    "chars": 194,
    "preview": "<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n\t<meta charset=\"UTF-8\">\n\t<title>Month</title>\n\t<meta http-equiv=\"refresh\" conten"
  },
  {
    "path": "package.json",
    "chars": 681,
    "preview": "{\n  \"name\": \"hpstr-theme\",\n  \"author\": \"Michael Rose <michael@mademistakes.com>\",\n  \"homepage\": \"http://mmistakes.github"
  },
  {
    "path": "posts.html",
    "chars": 813,
    "preview": "---\nlayout: post-index\npermalink: /posts/\ntitle: All Posts\ndescription: \"An archive of posts.\"\n---\n\n{% for post in site."
  },
  {
    "path": "ppt/css/font-awesome.css",
    "chars": 21986,
    "preview": "/*!\n *  Font Awesome 4.2.0 by @davegandy - http://fontawesome.io - @fontawesome\n *  License - http://fontawesome.io/lice"
  },
  {
    "path": "ppt/css/nodeppt.css",
    "chars": 390441,
    "preview": "@import url(http://fonts.useso.com/css?family=Source%20Code%20Pro:light,regular,semibold);html,body,div,span,applet,obje"
  },
  {
    "path": "ppt/css/pdf.css",
    "chars": 3360,
    "preview": "*{-webkit-print-color-adjust:exact}body{margin:0 auto !important;border:0;padding:0;float:none !important;overflow:visib"
  },
  {
    "path": "ppt/css/phone.css",
    "chars": 655,
    "preview": "slides>slide{-webkit-transition:none !important;-moz-transition:none !important;-o-transition:none !important;-webkit-tr"
  },
  {
    "path": "ppt/css/theme.blue.css",
    "chars": 2301,
    "preview": "::selection{color:#fff;background-color:#d33682;text-shadow:none}a{color:#f47f40;background-color:transparent;border-bot"
  },
  {
    "path": "ppt/css/theme.dark.css",
    "chars": 2301,
    "preview": "::selection{color:#fff;background-color:#d33682;text-shadow:none}a{color:#fa5b04;background-color:transparent;border-bot"
  },
  {
    "path": "ppt/css/theme.green.css",
    "chars": 2328,
    "preview": "::selection{color:#fff;background-color:#d33682;text-shadow:none}a{color:#ff8c78;background-color:transparent;border-bot"
  },
  {
    "path": "ppt/css/theme.light.css",
    "chars": 2334,
    "preview": "::selection{color:#fff;background-color:#d33682;text-shadow:none}a{color:#fa5b04;background-color:transparent;border-bot"
  },
  {
    "path": "ppt/css/theme.moon.css",
    "chars": 2060,
    "preview": "::selection{color:#fff;background-color:#d33682;text-shadow:none}a{color:#f9d905;background-color:transparent;border-bot"
  },
  {
    "path": "ppt/express.html",
    "chars": 15867,
    "preview": "<!--\n    Powered By nodePPT - This is probably the best web presentation tool so far!\n    version: 1.2.3\n    site: https"
  },
  {
    "path": "ppt/js/event/broadcast.js",
    "chars": 3403,
    "preview": "/**\n * 广播事件处理\n * 状态:稳定\n * \n * 目标: 为了尽可能的减少模块之间业务逻辑的耦合度, 而开发了这个eventbus, 主要用于业务逻辑的事件传递\n * 使用规范: 每个js模块尽可能通过事件去通信, 减少模块之间的"
  },
  {
    "path": "ppt/js/highlight/default.css",
    "chars": 2049,
    "preview": "/*\n\nOriginal style from softwaremaniacs.org (c) Ivan Sagalaev <Maniac@SoftwareManiacs.Org>\n\n*/\n\npre code {\n  display: bl"
  },
  {
    "path": "ppt/js/highlight/highlight.pack.js",
    "chars": 97105,
    "preview": "var hljs=new function(){function m(p){return p.replace(/&/gm,\"&amp;\").replace(/</gm,\"&lt;\")}function c(r,q,p){return Reg"
  },
  {
    "path": "ppt/js/highlight/hljs-0.8.js",
    "chars": 184851,
    "preview": "var hljs=new function(){function k(v){return v.replace(/&/gm,\"&amp;\").replace(/</gm,\"&lt;\").replace(/>/gm,\"&gt;\")}functi"
  },
  {
    "path": "ppt/js/highlight/languages/1c.js",
    "chars": 4201,
    "preview": "/*\nLanguage: 1C\nAuthor: Yuri Ivanov <ivanov@supersoft.ru>\nContributors: Sergey Baranov <segyrn@yandex.ru>\n*/\n\nfunction(h"
  },
  {
    "path": "ppt/js/highlight/languages/actionscript.js",
    "chars": 2128,
    "preview": "/*\nLanguage: ActionScript\nAuthor: Alexander Myadzel <myadzel@gmail.com>\n*/\n\nfunction(hljs) {\n  var IDENT_RE = '[a-zA-Z_$"
  },
  {
    "path": "ppt/js/highlight/languages/apache.js",
    "chars": 1514,
    "preview": "/*\nLanguage: Apache\nAuthor: Ruslan Keba <rukeba@gmail.com>\nContributors: Ivan Sagalaev <maniac@softwaremaniacs.org>\nWebs"
  },
  {
    "path": "ppt/js/highlight/languages/applescript.js",
    "chars": 3501,
    "preview": "/*\nLanguage: AppleScript\nAuthors: Nathan Grigg <nathan@nathanamy.org>\n         Dr. Drang <drdrang@gmail.com>\n*/\n\nfunctio"
  },
  {
    "path": "ppt/js/highlight/languages/asciidoc.js",
    "chars": 4750,
    "preview": "/*\nLanguage: AsciiDoc\nRequires: xml.js\nAuthor: Dan Allen <dan.j.allen@gmail.com>\nWebsite: http://google.com/profiles/dan"
  },
  {
    "path": "ppt/js/highlight/languages/autohotkey.js",
    "chars": 1567,
    "preview": "/*\nLanguage: AutoHotkey\nAuthor: Seongwon Lee <dlimpid@gmail.com>\nDescription: AutoHotkey language definition\n*/\n\nfunctio"
  },
  {
    "path": "ppt/js/highlight/languages/avrasm.js",
    "chars": 2698,
    "preview": "/*\nLanguage: AVR Assembler\nAuthor: Vladimir Ermakov <vooon341@gmail.com>\n*/\n\nfunction(hljs) {\n  return {\n    case_insens"
  },
  {
    "path": "ppt/js/highlight/languages/axapta.js",
    "chars": 1187,
    "preview": "/*\nLanguage: Axapta\nAuthor: Dmitri Roudakov <dmitri@roudakov.ru>\n*/\n\nfunction(hljs) {\n  return {\n    keywords: 'false in"
  },
  {
    "path": "ppt/js/highlight/languages/bash.js",
    "chars": 1573,
    "preview": "/*\nLanguage: Bash\nAuthor: vah <vahtenberg@gmail.com>\nContributrors: Benjamin Pannell <contact@sierrasoftworks.com>\n*/\n\nf"
  },
  {
    "path": "ppt/js/highlight/languages/brainfuck.js",
    "chars": 768,
    "preview": "/*\nLanguage: Brainfuck\nAuthor: Evgeny Stepanischev <imbolk@gmail.com>\n*/\n\nfunction(hljs){\n  var LITERAL = {\n    classNam"
  },
  {
    "path": "ppt/js/highlight/languages/capnproto.js",
    "chars": 1427,
    "preview": "/*\nLanguage: Cap’n Proto\nAuthor: Oleg Efimov <efimovov@gmail.com>\nDescription: Cap’n Proto message definition format\n*/\n"
  },
  {
    "path": "ppt/js/highlight/languages/clojure.js",
    "chars": 4591,
    "preview": "/*\nLanguage: Clojure\nDescription: Clojure syntax (based on lisp.js)\nAuthor: mfornos\n*/\n\nfunction(hljs) {\n  var keywords "
  },
  {
    "path": "ppt/js/highlight/languages/cmake.js",
    "chars": 2172,
    "preview": "/*\nLanguage: CMake\nDescription: CMake is an open-source cross-platform system for build automation.\nAuthor: Igor Kalnits"
  },
  {
    "path": "ppt/js/highlight/languages/coffeescript.js",
    "chars": 3802,
    "preview": "/*\nLanguage: CoffeeScript\nAuthor: Dmytrii Nagirniak <dnagir@gmail.com>\nContributors: Oleg Efimov <efimovov@gmail.com>, C"
  },
  {
    "path": "ppt/js/highlight/languages/cpp.js",
    "chars": 2842,
    "preview": "/*\nLanguage: C++\nAuthor: Ivan Sagalaev <maniac@softwaremaniacs.org>\nContributors: Evgeny Stepanischev <imbolk@gmail.com>"
  },
  {
    "path": "ppt/js/highlight/languages/cs.js",
    "chars": 2273,
    "preview": "/*\nLanguage: C#\nAuthor: Jason Diamond <jason@diamond.name>\n*/\n\nfunction(hljs) {\n  var KEYWORDS =\n    // Normal keywords."
  },
  {
    "path": "ppt/js/highlight/languages/css.js",
    "chars": 2870,
    "preview": "/*\nLanguage: CSS\n*/\n\nfunction(hljs) {\n  var IDENT_RE = '[a-zA-Z-][a-zA-Z0-9_-]*';\n  var FUNCTION = {\n    className: 'fun"
  },
  {
    "path": "ppt/js/highlight/languages/d.js",
    "chars": 6753,
    "preview": "/*\nLanguage: D\nAuthor: Aleksandar Ruzicic <aleksandar@ruzicic.info>\nDescription: D is a language with C-like syntax and "
  },
  {
    "path": "ppt/js/highlight/languages/delphi.js",
    "chars": 1829,
    "preview": "/*\nLanguage: Delphi\n*/\n\nfunction(hljs) {\n  var KEYWORDS =\n    'exports register file shl array record property for mod w"
  },
  {
    "path": "ppt/js/highlight/languages/diff.js",
    "chars": 999,
    "preview": "/*\nLanguage: Diff\nDescription: Unified and context diff\nAuthor: Vasily Polovnyov <vast@whiteants.net>\n*/\n\nfunction(hljs)"
  },
  {
    "path": "ppt/js/highlight/languages/django.js",
    "chars": 2390,
    "preview": "/*\nLanguage: Django\nRequires: xml.js\nAuthor: Ivan Sagalaev <maniac@softwaremaniacs.org>\nContributors: Ilya Baryshev <bar"
  },
  {
    "path": "ppt/js/highlight/languages/dos.js",
    "chars": 864,
    "preview": "/*\nLanguage: DOS .bat\nAuthor: Alexander Makarov (http://rmcreative.ru/)\n*/\n\nfunction(hljs) {\n  return {\n    aliases: ['b"
  },
  {
    "path": "ppt/js/highlight/languages/elixir.js",
    "chars": 2793,
    "preview": "/*\nLanguage: Elixir\nAuthor: Josh Adams <josh@isotope11.com>\nDescription: language definition for Elixir source code file"
  },
  {
    "path": "ppt/js/highlight/languages/erlang-repl.js",
    "chars": 1300,
    "preview": "/*\n Language: Erlang REPL\n Author: Sergey Ignatov <sergey@ignatov.spb.su>\n */\n\nfunction(hljs) {\n  return {\n    keywords:"
  },
  {
    "path": "ppt/js/highlight/languages/erlang.js",
    "chars": 3927,
    "preview": "/*\nLanguage: Erlang\nDescription: Erlang is a general-purpose functional language, with strict evaluation, single assignm"
  },
  {
    "path": "ppt/js/highlight/languages/fix.js",
    "chars": 638,
    "preview": "/*\nLanguage: FIX\nAuthor: Brent Bradbury <brent@brentium.com>\n*/\n\nfunction(hljs) {\n  return {\n    contains: [\n    {\n     "
  },
  {
    "path": "ppt/js/highlight/languages/fsharp.js",
    "chars": 1463,
    "preview": "/*\nLanguage: F#\nAuthor: Jonas Follesø <jonas@follesoe.no>\nContributors: Troy Kershaw <hello@troykershaw.com>\nDescription"
  },
  {
    "path": "ppt/js/highlight/languages/gherkin.js",
    "chars": 781,
    "preview": "/*\n Language: Gherkin\n Author: Sam Pikesley (@pikesley) <sam.pikesley@theodi.org>\n Description: Gherkin (Cucumber etc)\n "
  },
  {
    "path": "ppt/js/highlight/languages/glsl.js",
    "chars": 8104,
    "preview": "/*\nLanguage: GLSL\nDescription: OpenGL Shading Language\nAuthor: Sergey Tikhomirov <me@stikhomirov.com>\n*/\n\nfunction(hljs)"
  },
  {
    "path": "ppt/js/highlight/languages/go.js",
    "chars": 1310,
    "preview": "/*\nLanguage: Go\nAuthor: Stephan Kountso aka StepLg <steplg@gmail.com>\nContributors: Evgeny Stepanischev <imbolk@gmail.co"
  },
  {
    "path": "ppt/js/highlight/languages/gradle.js",
    "chars": 1908,
    "preview": "/*\nLanguage: Gradle\nAuthor: Damian Mee <mee.damian@gmail.com>\nWebsite: http://meeDamian.com\n*/\n\nfunction(hljs) {\n  retur"
  },
  {
    "path": "ppt/js/highlight/languages/haml.js",
    "chars": 3107,
    "preview": "/*\nLanguage: Haml\nRequires: ruby.js\nAuthor: Dan Allen <dan.j.allen@gmail.com>\nWebsite: http://google.com/profiles/dan.j."
  },
  {
    "path": "ppt/js/highlight/languages/handlebars.js",
    "chars": 1073,
    "preview": "/*\nLanguage: Handlebars\nRequires: xml.js\nAuthor: Robin Ward <robin.ward@gmail.com>\nDescription: Matcher for Handlebars a"
  },
  {
    "path": "ppt/js/highlight/languages/haskell.js",
    "chars": 3205,
    "preview": "/*\nLanguage: Haskell\nAuthor: Jeremy Hull <sourdrums@gmail.com>\nContributors: Zena Treep <zena.treep@gmail.com>\n*/\n\nfunct"
  },
  {
    "path": "ppt/js/highlight/languages/haxe.js",
    "chars": 1840,
    "preview": "/*\nLanguage: Haxe\nAuthor: Christopher Kaster <ikasoki@gmail.com> (Based on the actionscript.js language file by Alexande"
  },
  {
    "path": "ppt/js/highlight/languages/http.js",
    "chars": 961,
    "preview": "/*\n  Language: HTTP\n  Description: HTTP request and response headers with automatic body highlighting\n  Author: Ivan Sag"
  },
  {
    "path": "ppt/js/highlight/languages/ini.js",
    "chars": 649,
    "preview": "/*\nLanguage: Ini\n*/\n\nfunction(hljs) {\n  return {\n    case_insensitive: true,\n    illegal: /\\S/,\n    contains: [\n      {\n"
  },
  {
    "path": "ppt/js/highlight/languages/java.js",
    "chars": 1676,
    "preview": "/*\nLanguage: Java\nAuthor: Vsevolod Solovyov <vsevolod.solovyov@gmail.com>\n*/\n\nfunction(hljs) {\n  var KEYWORDS =\n    'fal"
  },
  {
    "path": "ppt/js/highlight/languages/javascript.js",
    "chars": 2407,
    "preview": "/*\nLanguage: JavaScript\n*/\n\nfunction(hljs) {\n  return {\n    aliases: ['js'],\n    keywords: {\n      keyword:\n        'in "
  },
  {
    "path": "ppt/js/highlight/languages/json.js",
    "chars": 1078,
    "preview": "/*\nLanguage: JSON\nAuthor: Ivan Sagalaev <maniac@softwaremaniacs.org>\n*/\n\nfunction(hljs) {\n  var LITERALS = {literal: 'tr"
  }
]

// ... and 633 more files (download for full content)

About this extraction

This page contains the full source code of the hacke2/hacke2.github.io GitHub repository, extracted and formatted as plain text for AI agents and large language models (LLMs). The extraction includes 833 files (8.2 MB), approximately 2.2M tokens, and a symbol index with 2193 extracted functions, classes, methods, constants, and types. Use this with OpenClaw, Claude, ChatGPT, Cursor, Windsurf, or any other AI tool that accepts text input. You can copy the full output to your clipboard or download it as a .txt file.

Extracted by GitExtract — free GitHub repo to text converter for AI. Built by Nikandr Surkov.

Copied to clipboard!