├── .gitignore
├── Labs
├── Building Custom JavaScript Objects
│ ├── Begin
│ │ └── index.html
│ └── End
│ │ └── index.html
├── Getting Started with JavaScript
│ ├── Begin
│ │ ├── index.html
│ │ └── script.js
│ └── End
│ │ ├── index.html
│ │ └── script.js
├── JavaScript and Geolocation
│ ├── Begin
│ │ ├── index.html
│ │ ├── package.json
│ │ └── server.js
│ └── End
│ │ ├── index.html
│ │ ├── package.json
│ │ └── server.js
├── JavaScript and LocalStorage
│ ├── Begin
│ │ └── index.html
│ └── End
│ │ └── index.html
├── JavaScript and the DOM
│ ├── Begin
│ │ └── .gitkeep
│ └── End
│ │ └── index.html
├── Understanding Closures
│ ├── Begin
│ │ ├── closures.js
│ │ ├── index.html
│ │ └── simpleClosure.html
│ └── End
│ │ ├── closures.js
│ │ ├── index.html
│ │ └── simpleClosure.html
├── Using Data Binding and Templates
│ ├── Begin
│ │ ├── data.json.txt
│ │ ├── index.html
│ │ ├── js
│ │ │ ├── ajaxService.js
│ │ │ ├── capitalizer.js
│ │ │ ├── handlebars.js
│ │ │ ├── q.js
│ │ │ └── tableHelper.js
│ │ ├── package.json
│ │ ├── server.js
│ │ └── styles
│ │ │ └── styles.css
│ └── End
│ │ ├── data.json.txt
│ │ ├── index.html
│ │ ├── js
│ │ ├── ajaxService.js
│ │ ├── capitalizer.js
│ │ ├── handlebars.js
│ │ ├── handlebarsHelper.js
│ │ ├── q.js
│ │ └── tableHelper.js
│ │ ├── package.json
│ │ ├── server.js
│ │ └── styles
│ │ └── styles.css
├── Using the Prototype Pattern
│ ├── Begin
│ │ ├── car.js
│ │ └── index.html
│ └── End
│ │ ├── car.js
│ │ ├── index.html
│ │ └── tests.html
├── Using the Revealing Module Pattern
│ ├── Begin
│ │ ├── car.js
│ │ ├── index.html
│ │ └── tests.html
│ └── End
│ │ ├── car.js
│ │ ├── index.html
│ │ └── tests.html
├── Using the Revealing Prototype Pattern
│ ├── Begin
│ │ ├── car.js
│ │ ├── index.html
│ │ └── tests.html
│ └── End
│ │ ├── car.js
│ │ ├── index.html
│ │ └── tests.html
├── Working with ES2015
│ ├── Begin
│ │ ├── .babelrc
│ │ ├── gulpfile.js
│ │ ├── index.html
│ │ ├── js
│ │ │ ├── autos.js
│ │ │ ├── compiled
│ │ │ │ ├── babel
│ │ │ │ │ └── .gitkeep
│ │ │ │ └── traceur
│ │ │ │ │ └── .gitkeep
│ │ │ └── libs
│ │ │ │ └── traceur.js
│ │ └── package.json
│ └── End
│ │ ├── .babelrc
│ │ ├── gulpfile.js
│ │ ├── index.html
│ │ ├── js
│ │ ├── autos.js
│ │ ├── compiled
│ │ │ └── babel
│ │ │ │ ├── .gitkeep
│ │ │ │ └── autos.js
│ │ └── libs
│ │ │ └── traceur.js
│ │ ├── package-lock.json
│ │ └── package.json
└── Working with Functions
│ ├── Begin
│ ├── data.json.txt
│ ├── index.html
│ ├── js
│ │ ├── ajaxService.js
│ │ ├── capitalizer.js
│ │ ├── q.js
│ │ └── tableHelper.js
│ ├── package.json
│ ├── server.js
│ └── styles
│ │ └── styles.css
│ └── End
│ ├── data.json.txt
│ ├── index.html
│ ├── js
│ ├── ajaxService.js
│ ├── capitalizer.js
│ ├── q.js
│ └── tableHelper.js
│ ├── package.json
│ ├── server.js
│ └── styles
│ └── styles.css
├── Mastering JavaScript
├── .babelrc
├── gulpfile.js
├── index.html
├── js
│ ├── ace
│ │ ├── ace.js
│ │ ├── ext-beautify.js
│ │ ├── ext-chromevox.js
│ │ ├── ext-elastic_tabstops_lite.js
│ │ ├── ext-emmet.js
│ │ ├── ext-error_marker.js
│ │ ├── ext-keybinding_menu.js
│ │ ├── ext-language_tools.js
│ │ ├── ext-linking.js
│ │ ├── ext-modelist.js
│ │ ├── ext-old_ie.js
│ │ ├── ext-searchbox.js
│ │ ├── ext-settings_menu.js
│ │ ├── ext-spellcheck.js
│ │ ├── ext-split.js
│ │ ├── ext-static_highlight.js
│ │ ├── ext-statusbar.js
│ │ ├── ext-textarea.js
│ │ ├── ext-themelist.js
│ │ ├── ext-whitespace.js
│ │ ├── keybinding-emacs.js
│ │ ├── keybinding-vim.js
│ │ ├── mode-abap.js
│ │ ├── mode-actionscript.js
│ │ ├── mode-ada.js
│ │ ├── mode-apache_conf.js
│ │ ├── mode-applescript.js
│ │ ├── mode-asciidoc.js
│ │ ├── mode-assembly_x86.js
│ │ ├── mode-autohotkey.js
│ │ ├── mode-batchfile.js
│ │ ├── mode-c9search.js
│ │ ├── mode-c_cpp.js
│ │ ├── mode-cirru.js
│ │ ├── mode-clojure.js
│ │ ├── mode-cobol.js
│ │ ├── mode-coffee.js
│ │ ├── mode-coldfusion.js
│ │ ├── mode-csharp.js
│ │ ├── mode-css.js
│ │ ├── mode-curly.js
│ │ ├── mode-d.js
│ │ ├── mode-dart.js
│ │ ├── mode-diff.js
│ │ ├── mode-django.js
│ │ ├── mode-dockerfile.js
│ │ ├── mode-dot.js
│ │ ├── mode-eiffel.js
│ │ ├── mode-ejs.js
│ │ ├── mode-erlang.js
│ │ ├── mode-forth.js
│ │ ├── mode-ftl.js
│ │ ├── mode-gcode.js
│ │ ├── mode-gherkin.js
│ │ ├── mode-gitignore.js
│ │ ├── mode-glsl.js
│ │ ├── mode-golang.js
│ │ ├── mode-groovy.js
│ │ ├── mode-haml.js
│ │ ├── mode-handlebars.js
│ │ ├── mode-haskell.js
│ │ ├── mode-haxe.js
│ │ ├── mode-html.js
│ │ ├── mode-html_ruby.js
│ │ ├── mode-ini.js
│ │ ├── mode-io.js
│ │ ├── mode-jack.js
│ │ ├── mode-jade.js
│ │ ├── mode-java.js
│ │ ├── mode-javascript.js
│ │ ├── mode-json.js
│ │ ├── mode-jsoniq.js
│ │ ├── mode-jsp.js
│ │ ├── mode-jsx.js
│ │ ├── mode-julia.js
│ │ ├── mode-latex.js
│ │ ├── mode-less.js
│ │ ├── mode-liquid.js
│ │ ├── mode-lisp.js
│ │ ├── mode-livescript.js
│ │ ├── mode-logiql.js
│ │ ├── mode-lsl.js
│ │ ├── mode-lua.js
│ │ ├── mode-luapage.js
│ │ ├── mode-lucene.js
│ │ ├── mode-makefile.js
│ │ ├── mode-markdown.js
│ │ ├── mode-matlab.js
│ │ ├── mode-mel.js
│ │ ├── mode-mushcode.js
│ │ ├── mode-mysql.js
│ │ ├── mode-nix.js
│ │ ├── mode-objectivec.js
│ │ ├── mode-ocaml.js
│ │ ├── mode-pascal.js
│ │ ├── mode-perl.js
│ │ ├── mode-pgsql.js
│ │ ├── mode-php.js
│ │ ├── mode-plain_text.js
│ │ ├── mode-powershell.js
│ │ ├── mode-praat.js
│ │ ├── mode-prolog.js
│ │ ├── mode-properties.js
│ │ ├── mode-protobuf.js
│ │ ├── mode-python.js
│ │ ├── mode-r.js
│ │ ├── mode-rdoc.js
│ │ ├── mode-rhtml.js
│ │ ├── mode-ruby.js
│ │ ├── mode-rust.js
│ │ ├── mode-sass.js
│ │ ├── mode-scad.js
│ │ ├── mode-scala.js
│ │ ├── mode-scheme.js
│ │ ├── mode-scss.js
│ │ ├── mode-sh.js
│ │ ├── mode-sjs.js
│ │ ├── mode-smarty.js
│ │ ├── mode-snippets.js
│ │ ├── mode-soy_template.js
│ │ ├── mode-space.js
│ │ ├── mode-sql.js
│ │ ├── mode-stylus.js
│ │ ├── mode-svg.js
│ │ ├── mode-tcl.js
│ │ ├── mode-tex.js
│ │ ├── mode-text.js
│ │ ├── mode-textile.js
│ │ ├── mode-toml.js
│ │ ├── mode-twig.js
│ │ ├── mode-typescript.js
│ │ ├── mode-vala.js
│ │ ├── mode-vbscript.js
│ │ ├── mode-velocity.js
│ │ ├── mode-verilog.js
│ │ ├── mode-vhdl.js
│ │ ├── mode-xml.js
│ │ ├── mode-xquery.js
│ │ ├── mode-yaml.js
│ │ ├── snippets
│ │ │ ├── abap.js
│ │ │ ├── actionscript.js
│ │ │ ├── ada.js
│ │ │ ├── apache_conf.js
│ │ │ ├── applescript.js
│ │ │ ├── asciidoc.js
│ │ │ ├── assembly_x86.js
│ │ │ ├── autohotkey.js
│ │ │ ├── batchfile.js
│ │ │ ├── c9search.js
│ │ │ ├── c_cpp.js
│ │ │ ├── cirru.js
│ │ │ ├── clojure.js
│ │ │ ├── cobol.js
│ │ │ ├── coffee.js
│ │ │ ├── coldfusion.js
│ │ │ ├── csharp.js
│ │ │ ├── css.js
│ │ │ ├── curly.js
│ │ │ ├── d.js
│ │ │ ├── dart.js
│ │ │ ├── diff.js
│ │ │ ├── django.js
│ │ │ ├── dockerfile.js
│ │ │ ├── dot.js
│ │ │ ├── eiffel.js
│ │ │ ├── ejs.js
│ │ │ ├── erlang.js
│ │ │ ├── forth.js
│ │ │ ├── ftl.js
│ │ │ ├── gcode.js
│ │ │ ├── gherkin.js
│ │ │ ├── gitignore.js
│ │ │ ├── glsl.js
│ │ │ ├── golang.js
│ │ │ ├── groovy.js
│ │ │ ├── haml.js
│ │ │ ├── handlebars.js
│ │ │ ├── haskell.js
│ │ │ ├── haxe.js
│ │ │ ├── html.js
│ │ │ ├── html_ruby.js
│ │ │ ├── ini.js
│ │ │ ├── io.js
│ │ │ ├── jack.js
│ │ │ ├── jade.js
│ │ │ ├── java.js
│ │ │ ├── javascript.js
│ │ │ ├── json.js
│ │ │ ├── jsoniq.js
│ │ │ ├── jsp.js
│ │ │ ├── jsx.js
│ │ │ ├── julia.js
│ │ │ ├── latex.js
│ │ │ ├── less.js
│ │ │ ├── liquid.js
│ │ │ ├── lisp.js
│ │ │ ├── livescript.js
│ │ │ ├── logiql.js
│ │ │ ├── lsl.js
│ │ │ ├── lua.js
│ │ │ ├── luapage.js
│ │ │ ├── lucene.js
│ │ │ ├── makefile.js
│ │ │ ├── markdown.js
│ │ │ ├── matlab.js
│ │ │ ├── mel.js
│ │ │ ├── mushcode.js
│ │ │ ├── mysql.js
│ │ │ ├── nix.js
│ │ │ ├── objectivec.js
│ │ │ ├── ocaml.js
│ │ │ ├── pascal.js
│ │ │ ├── perl.js
│ │ │ ├── pgsql.js
│ │ │ ├── php.js
│ │ │ ├── plain_text.js
│ │ │ ├── powershell.js
│ │ │ ├── praat.js
│ │ │ ├── prolog.js
│ │ │ ├── properties.js
│ │ │ ├── protobuf.js
│ │ │ ├── python.js
│ │ │ ├── r.js
│ │ │ ├── rdoc.js
│ │ │ ├── rhtml.js
│ │ │ ├── ruby.js
│ │ │ ├── rust.js
│ │ │ ├── sass.js
│ │ │ ├── scad.js
│ │ │ ├── scala.js
│ │ │ ├── scheme.js
│ │ │ ├── scss.js
│ │ │ ├── sh.js
│ │ │ ├── sjs.js
│ │ │ ├── smarty.js
│ │ │ ├── snippets.js
│ │ │ ├── soy_template.js
│ │ │ ├── space.js
│ │ │ ├── sql.js
│ │ │ ├── stylus.js
│ │ │ ├── svg.js
│ │ │ ├── tcl.js
│ │ │ ├── tex.js
│ │ │ ├── text.js
│ │ │ ├── textile.js
│ │ │ ├── toml.js
│ │ │ ├── twig.js
│ │ │ ├── typescript.js
│ │ │ ├── vala.js
│ │ │ ├── vbscript.js
│ │ │ ├── velocity.js
│ │ │ ├── verilog.js
│ │ │ ├── vhdl.js
│ │ │ ├── xml.js
│ │ │ ├── xquery.js
│ │ │ └── yaml.js
│ │ ├── theme-ambiance.js
│ │ ├── theme-chaos.js
│ │ ├── theme-chrome.js
│ │ ├── theme-clouds.js
│ │ ├── theme-clouds_midnight.js
│ │ ├── theme-cobalt.js
│ │ ├── theme-crimson_editor.js
│ │ ├── theme-dawn.js
│ │ ├── theme-dreamweaver.js
│ │ ├── theme-eclipse.js
│ │ ├── theme-github.js
│ │ ├── theme-idle_fingers.js
│ │ ├── theme-katzenmilch.js
│ │ ├── theme-kr.js
│ │ ├── theme-kr_theme.js
│ │ ├── theme-kuroir.js
│ │ ├── theme-merbivore.js
│ │ ├── theme-merbivore_soft.js
│ │ ├── theme-mono_industrial.js
│ │ ├── theme-monokai.js
│ │ ├── theme-pastel_on_dark.js
│ │ ├── theme-solarized_dark.js
│ │ ├── theme-solarized_light.js
│ │ ├── theme-terminal.js
│ │ ├── theme-textmate.js
│ │ ├── theme-tomorrow.js
│ │ ├── theme-tomorrow_night.js
│ │ ├── theme-tomorrow_night_blue.js
│ │ ├── theme-tomorrow_night_bright.js
│ │ ├── theme-tomorrow_night_eighties.js
│ │ ├── theme-twilight.js
│ │ ├── theme-vibrant_ink.js
│ │ ├── theme-visualstudio.js
│ │ ├── theme-xcode.js
│ │ ├── worker-coffee.js
│ │ ├── worker-css.js
│ │ ├── worker-html.js
│ │ ├── worker-javascript.js
│ │ ├── worker-json.js
│ │ ├── worker-lua.js
│ │ ├── worker-php.js
│ │ └── worker-xquery.js
│ ├── compiled
│ │ ├── babel
│ │ │ ├── arrowFunctions.js
│ │ │ ├── arrowFunctions.js.map
│ │ │ ├── classes.js
│ │ │ ├── classes.js.map
│ │ │ ├── destructuring.js
│ │ │ ├── destructuring.js.map
│ │ │ ├── loggerLoader.js
│ │ │ ├── loggerLoader.js.map
│ │ │ ├── maps.js
│ │ │ ├── maps.js.map
│ │ │ ├── modules-classes.js
│ │ │ ├── modules-classes.js.map
│ │ │ ├── parameters.js
│ │ │ ├── parameters.js.map
│ │ │ ├── scopeAndLet.js
│ │ │ ├── scopeAndLet.js.map
│ │ │ ├── sets.js
│ │ │ ├── sets.js.map
│ │ │ ├── templateStrings.js
│ │ │ ├── templateStrings.js.map
│ │ │ ├── weakmap-weakset.js
│ │ │ └── weakmap-weakset.js.map
│ │ └── typescript
│ │ │ ├── calculator.js
│ │ │ ├── calculatorJQuery.js
│ │ │ ├── classExtension.js
│ │ │ ├── definingClasses.js
│ │ │ └── interfaces.js
│ ├── dist
│ │ └── scripts.min.js
│ ├── editor.js
│ ├── iframe.html
│ ├── libs
│ │ ├── angular.min.js
│ │ ├── bootstrap.min.js
│ │ ├── handlebars-v2.0.0.js
│ │ ├── jquery-2.1.1.min.js
│ │ ├── knockoutjs.js
│ │ ├── q.js
│ │ ├── traceur-bootstrap.js
│ │ └── traceur.js
│ └── samples.js
├── package-lock.json
├── package.json
├── readme.txt
├── samples
│ ├── dataBindingAndTemplates
│ │ ├── angularJS
│ │ │ ├── basics.css
│ │ │ ├── basics.html
│ │ │ ├── basics.js
│ │ │ ├── table.css
│ │ │ ├── table.html
│ │ │ └── table.js
│ │ ├── handlebars
│ │ │ ├── basics.css
│ │ │ ├── basics.html
│ │ │ ├── basics.js
│ │ │ ├── table.css
│ │ │ ├── table.html
│ │ │ └── table.js
│ │ ├── knockoutJS
│ │ │ ├── basics.css
│ │ │ ├── basics.html
│ │ │ ├── basics.js
│ │ │ ├── table.css
│ │ │ ├── table.html
│ │ │ └── table.js
│ │ ├── manipulatingTheDOM.html
│ │ └── manipulatingTheDOM.js
│ ├── es2015
│ │ ├── Working with ES2015 Modules
│ │ │ ├── .gitignore
│ │ │ ├── config.js
│ │ │ ├── dist
│ │ │ │ ├── auto.js
│ │ │ │ ├── car.js
│ │ │ │ ├── main.js
│ │ │ │ └── truck.js
│ │ │ ├── gulpfile.js
│ │ │ ├── index.html
│ │ │ ├── js
│ │ │ │ ├── auto.js
│ │ │ │ ├── car.js
│ │ │ │ ├── main.js
│ │ │ │ └── truck.js
│ │ │ ├── jsconfig.json
│ │ │ ├── npm-debug.log
│ │ │ ├── package.json
│ │ │ ├── readme.md
│ │ │ └── typings
│ │ │ │ └── node
│ │ │ │ └── node.d.ts
│ │ ├── arrowFunctions.html
│ │ ├── arrowFunctions.js
│ │ ├── classes.html
│ │ ├── classes.js
│ │ ├── destructuring.html
│ │ ├── destructuring.js
│ │ ├── loggerLoader.js
│ │ ├── maps.html
│ │ ├── maps.js
│ │ ├── modules-classes.html
│ │ ├── modules-classes.js
│ │ ├── parameters.html
│ │ ├── parameters.js
│ │ ├── scopeAndLet.html
│ │ ├── scopeAndLet.js
│ │ ├── sets.html
│ │ ├── sets.js
│ │ ├── templateStrings.html
│ │ ├── templateStrings.js
│ │ ├── traceurCompileOnTheFly.html
│ │ ├── weakmap-weakset.html
│ │ └── weakmap-weakset.js
│ ├── functionTechniques
│ │ ├── arrayFunctions.html
│ │ ├── arrayFunctions.js
│ │ ├── bind-calculator.html
│ │ ├── bind-calculator.js
│ │ ├── call-apply.html
│ │ ├── call-apply.js
│ │ ├── call-tableHelper.html
│ │ ├── call-tableHelper.js
│ │ ├── capturingThis-tableHelper.html
│ │ ├── capturingThis-tableHelper.js
│ │ ├── customers.txt
│ │ ├── iife.html
│ │ ├── iife.js
│ │ ├── promises-callbacks.html
│ │ ├── promises-callbacks.js
│ │ ├── promisesAndQ.html
│ │ ├── promisesAndQ.js
│ │ └── tableStyles.css
│ ├── jsCanvasDemos
│ │ ├── Images
│ │ │ ├── drawImageAPI.png
│ │ │ └── super-mario-bros-3.png
│ │ ├── Textor
│ │ │ ├── Textor.html
│ │ │ ├── javascript.js
│ │ │ └── texteditor.js
│ │ ├── canvasFundamentals.html
│ │ ├── canvasSimpleAnimation.html
│ │ ├── chart.html
│ │ ├── chart.js
│ │ └── web.config
│ ├── jsDOM
│ │ ├── domManipulation.html
│ │ ├── domManipulation.js
│ │ ├── events.html
│ │ ├── events.js
│ │ ├── manipulatingCSS.css
│ │ ├── manipulatingCSS.html
│ │ └── manipulatingCSS.js
│ ├── jsGeolocation
│ │ ├── geolocationDemo.html
│ │ ├── geolocationDemo.js
│ │ ├── geolocationWithMap.html
│ │ ├── geolocationWithMap.js
│ │ ├── simpleGeolocation.html
│ │ └── simpleGeolocation.js
│ ├── jsLocalStorage
│ │ ├── Images
│ │ │ └── chalkboard.jpg
│ │ ├── LocalStorage.html
│ │ ├── LocalStorageWithExpandos.html
│ │ ├── ScribbleStorage.html
│ │ └── Scripts
│ │ │ └── jquery.js
│ ├── jsObjects
│ │ ├── constructors.html
│ │ ├── constructors.js
│ │ ├── constructorsAndInstanceOf.html
│ │ ├── constructorsAndInstanceOf.js
│ │ ├── factories.html
│ │ ├── factories.js
│ │ ├── functionsAreObjects.html
│ │ ├── functionsAreObjects.js
│ │ ├── hoisting.html
│ │ ├── hoisting.js
│ │ ├── inheritance-classical-functionBase.html
│ │ ├── inheritance-classical-functionBase.js
│ │ ├── inheritance-overriding.html
│ │ ├── inheritance-overriding.js
│ │ ├── inheritance-prototypal-objectBase.html
│ │ ├── inheritance-prototypal-objectBase.js
│ │ ├── inheritance-prototypesAndProperties.html
│ │ ├── inheritance-prototypesAndProperties.js
│ │ ├── properties.html
│ │ ├── properties.js
│ │ ├── staticVariables.html
│ │ └── staticVariables.js
│ ├── jsPatterns
│ │ ├── closure.html
│ │ ├── closure.js
│ │ ├── functions.html
│ │ ├── functions.js
│ │ ├── prototypePattern.html
│ │ ├── prototypePattern.js
│ │ ├── revealingModulePattern.html
│ │ ├── revealingModulePattern.js
│ │ ├── revealingPrototypePattern.html
│ │ ├── revealingPrototypePattern.js
│ │ └── styles.css
│ ├── jsPrimer
│ │ ├── conditionals.html
│ │ ├── conditionals.js
│ │ ├── functions.html
│ │ ├── functions.js
│ │ ├── loops.html
│ │ ├── loops.js
│ │ ├── objectsAndObjectLiterals.html
│ │ ├── objectsAndObjectLiterals.js
│ │ ├── useStrict.html
│ │ ├── useStrict.js
│ │ ├── usingTypeOf.html
│ │ ├── usingTypeOf.js
│ │ ├── variablesAndTypes.html
│ │ └── variablesAndTypes.js
│ └── typescript
│ │ ├── calculator.css
│ │ ├── calculator.html
│ │ ├── calculator.ts
│ │ ├── calculatorJQuery.html
│ │ ├── calculatorJQuery.ts
│ │ ├── classExtension.html
│ │ ├── classExtension.ts
│ │ ├── definingClasses.html
│ │ ├── definingClasses.ts
│ │ ├── interfaces.html
│ │ ├── interfaces.ts
│ │ └── jquery.d.ts
├── server.js
└── styles
│ ├── boostrap.min.css
│ ├── iframe.css
│ └── styles.css
└── README.md
/.gitignore:
--------------------------------------------------------------------------------
1 | bin
2 | obj
3 | *.suo
4 | packages
5 | *.mdf
6 | *.ldf
7 | node_modules
8 |
--------------------------------------------------------------------------------
/Labs/Building Custom JavaScript Objects/Begin/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Building Custom JavaScript Objects
5 |
6 |
7 | Automobiles
8 |
9 |
10 |
11 |
15 |
16 |
--------------------------------------------------------------------------------
/Labs/Getting Started with JavaScript/Begin/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Getting Started with JavaScript
5 | Right-click and select "Inspect" in Chrome to see the console output.
6 |
7 |
8 |
--------------------------------------------------------------------------------
/Labs/Getting Started with JavaScript/Begin/script.js:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DanWahlin/MasteringJavaScriptCourseCode/f1943ad51260d83f8cec70367fd321bf277fdc52/Labs/Getting Started with JavaScript/Begin/script.js
--------------------------------------------------------------------------------
/Labs/Getting Started with JavaScript/End/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Getting Started with JavaScript
5 | Right-click and select "Inspect" in Chrome to see the console output.
6 |
7 |
8 |
--------------------------------------------------------------------------------
/Labs/Getting Started with JavaScript/End/script.js:
--------------------------------------------------------------------------------
1 | //Working with variables
2 | var name = 'Jane Doe',
3 | age = 57,
4 | isRegistered = true,
5 | pets = [ 'Fido', 'Fluffy', 'Peppy'];
6 |
7 | //Logging variables
8 | console.log(name);
9 | console.log(age);
10 | console.log(isRegistered);
11 | console.log(pets);
12 | console.log('Logging Pets using a for loop (except Peppy)')
13 | for (var i=0;i < pets.length;i++) {
14 | if (pets[i] !== 'Peppy') {
15 | console.log(pets[i]);
16 | }
17 | }
18 | console.log('');
19 | //Working with functions
20 | function add(x,y) {
21 | console.log('Add Result: ' + (x + y));
22 | }
23 |
24 | add(40,56);
25 | console.log('');
26 |
27 | //Functions as an Object
28 | function Person(name, age, isRegistered) {
29 | this.name = name;
30 | this.age = age;
31 | this.isRegistered = isRegistered;
32 | }
33 |
34 | var person = new Person('John Doe', 26, false);
35 | console.log('Person (function/object): ' + person.name + ' ' + person.age + ' ' + person.isRegistered);
36 | console.log('');
37 |
38 | //Working with Object Literals
39 | var customer = {
40 | name: 'Tina Thomas',
41 | age: 35,
42 | isRegistered: true
43 | };
44 |
45 | console.log('Customer (object literal): ' + customer.name + ' ' + customer.age + ' ' + customer.isRegistered);
46 |
47 |
48 |
--------------------------------------------------------------------------------
/Labs/JavaScript and Geolocation/Begin/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | Geolocation Lab
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
21 |
22 |
23 |
--------------------------------------------------------------------------------
/Labs/JavaScript and Geolocation/Begin/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "jsdemos",
3 | "version": "1.0.0",
4 | "description": "Used for JavaScript Demos",
5 | "author": "Dan Wahlin",
6 | "scripts": {
7 | "stop": "node server.js"
8 | },
9 | "dependencies": {
10 | "express": "^4.14.0"
11 | }
12 | }
13 |
--------------------------------------------------------------------------------
/Labs/JavaScript and Geolocation/Begin/server.js:
--------------------------------------------------------------------------------
1 | var express = require('express');
2 | var app = express();
3 |
4 | app.use(express.static(__dirname));
5 |
6 | app.listen(8080);
7 | console.log('Listening on port 8080');
--------------------------------------------------------------------------------
/Labs/JavaScript and Geolocation/End/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "jsdemos",
3 | "version": "1.0.0",
4 | "description": "Used for JavaScript Demos",
5 | "author": "Dan Wahlin",
6 | "scripts": {
7 | "stop": "node server.js"
8 | },
9 | "dependencies": {
10 | "express": "^4.14.0"
11 | }
12 | }
13 |
--------------------------------------------------------------------------------
/Labs/JavaScript and Geolocation/End/server.js:
--------------------------------------------------------------------------------
1 | var express = require('express');
2 | var app = express();
3 |
4 | app.use(express.static(__dirname));
5 |
6 | app.listen(8080);
7 | console.log('Listening on port 8080');
--------------------------------------------------------------------------------
/Labs/JavaScript and LocalStorage/Begin/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Using Local Storage
5 |
6 |
7 |
8 | Preferences
9 |
10 | Favorite City:
11 |
12 | Favorite Color:
13 |
14 | Select One:
15 | Blue
16 | Red
17 | Green
18 | Other
19 |
20 |
21 | Save Preferences
22 | Clear Preferences
23 |
24 |
25 |
26 |
27 |
28 |
29 |
--------------------------------------------------------------------------------
/Labs/JavaScript and the DOM/Begin/.gitkeep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DanWahlin/MasteringJavaScriptCourseCode/f1943ad51260d83f8cec70367fd321bf277fdc52/Labs/JavaScript and the DOM/Begin/.gitkeep
--------------------------------------------------------------------------------
/Labs/Understanding Closures/Begin/closures.js:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DanWahlin/MasteringJavaScriptCourseCode/f1943ad51260d83f8cec70367fd321bf277fdc52/Labs/Understanding Closures/Begin/closures.js
--------------------------------------------------------------------------------
/Labs/Understanding Closures/Begin/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | This is the container
6 |
7 | Border Size 1
8 | Border Size 6
9 |
10 |
11 |
12 |
--------------------------------------------------------------------------------
/Labs/Understanding Closures/Begin/simpleClosure.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Using Functions
5 |
9 |
10 |
11 |
12 |
Using a closure
13 | Note that the date variable milliseconds shown
14 | is the same across calls to the myClosure() function in the code.
15 | This is due to a "closure" being created that keeps the variable alive
16 | across function calls.
17 |
18 |
19 |
20 |
21 |
22 |
27 |
28 |
29 |
--------------------------------------------------------------------------------
/Labs/Understanding Closures/End/closures.js:
--------------------------------------------------------------------------------
1 | function borderChanger(id, size) {
2 | return function() {
3 | document.getElementById(id).style.border = size + 'px solid black';
4 | };
5 | }
6 |
7 | var divId = 'container';
8 | var size1 = borderChanger(divId, 1);
9 | var size6 = borderChanger(divId, 6);
10 |
11 | document.getElementById('size-1').onclick = size1;
12 | document.getElementById('size-6').onclick = size6;
--------------------------------------------------------------------------------
/Labs/Understanding Closures/End/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | This is the container
6 |
7 | Border Size 1
8 | Border Size 6
9 |
10 |
11 |
12 |
--------------------------------------------------------------------------------
/Labs/Understanding Closures/End/simpleClosure.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Using Functions
5 |
9 |
10 |
11 |
12 |
Using a Closure
13 | Note that the date variable milliseconds shown
14 | is the same across calls to the myClosure() function in the code.
15 | This is due to a "closure" being created that keeps the variable alive
16 | across function calls.
17 |
18 |
19 |
20 |
21 |
22 |
48 |
49 |
50 |
--------------------------------------------------------------------------------
/Labs/Using Data Binding and Templates/Begin/data.json.txt:
--------------------------------------------------------------------------------
1 | [
2 | { "firstName": "jane", "lastName": "doe", "city": "phoenix" },
3 | { "firstName": "john", "lastName": "doe", "city": "phoenix" },
4 | { "firstName": "michelle", "lastName": "thompson", "city": "seattle" },
5 | { "firstName": "jose", "lastName": "rodriguez", "city": "california" },
6 | { "firstName": "tina", "lastName": "smith", "city": "san francisco" }
7 | ]
--------------------------------------------------------------------------------
/Labs/Using Data Binding and Templates/Begin/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Working with Functions
5 |
6 |
7 |
8 | Customer Data
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
40 |
41 |
42 |
43 |
--------------------------------------------------------------------------------
/Labs/Using Data Binding and Templates/Begin/js/ajaxService.js:
--------------------------------------------------------------------------------
1 | var ajaxService = function() {
2 |
3 | this.getJSON = function(url) {
4 | var xhr = new XMLHttpRequest();
5 | xhr.open("GET", url, true);
6 | xhr.setRequestHeader("Accept", "application/json");
7 |
8 | var deferred = Q.defer();
9 |
10 | xhr.onload = function (e) {
11 | if (xhr.readyState === 4) {
12 | if (xhr.status === 200) {
13 | var data = (xhr.responseText) ? JSON.parse(xhr.responseText) : null;
14 | deferred.resolve(data);
15 | } else {
16 | deferred.reject(xhr);
17 | }
18 | }
19 | };
20 |
21 | xhr.onerror = function (e) {
22 | console.error(xhr.statusText);
23 | };
24 |
25 | xhr.send();
26 | return deferred.promise;
27 | };
28 |
29 | return this;
30 |
31 | }();
32 |
33 |
--------------------------------------------------------------------------------
/Labs/Using Data Binding and Templates/Begin/js/capitalizer.js:
--------------------------------------------------------------------------------
1 | var capitalizer = function() {
2 |
3 | this.capitalize = function(value) {
4 | var upper = value.split(' ').map(function(str) {
5 | return str.charAt(0).toUpperCase() + str.slice(1);
6 | });
7 | return upper.join(' ');
8 | }
9 |
10 | return this;
11 |
12 | }();
13 |
14 |
--------------------------------------------------------------------------------
/Labs/Using Data Binding and Templates/Begin/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "server",
3 | "version": "1.0.0",
4 | "description": "Used for JavaScript Demos",
5 | "author": "Dan Wahlin",
6 | "dependencies": {
7 | "express": "^4.14.0"
8 | }
9 | }
10 |
--------------------------------------------------------------------------------
/Labs/Using Data Binding and Templates/Begin/server.js:
--------------------------------------------------------------------------------
1 | var express = require('express');
2 | var app = express();
3 |
4 | app.use(express.static(__dirname));
5 |
6 | app.listen(9000);
7 | console.log('Listening on port 9000');
--------------------------------------------------------------------------------
/Labs/Using Data Binding and Templates/Begin/styles/styles.css:
--------------------------------------------------------------------------------
1 | table { width: 400px;}
2 | th { text-align:left;}
3 | tbody > tr:nth-child(odd) { background: #efefef; }
4 | .rowCount { margin-top: 10px; }
5 | .highlight { color: green; font-weight:bold;}
--------------------------------------------------------------------------------
/Labs/Using Data Binding and Templates/End/data.json.txt:
--------------------------------------------------------------------------------
1 | [
2 | { "firstName": "jane", "lastName": "doe", "city": "phoenix" },
3 | { "firstName": "john", "lastName": "doe", "city": "phoenix" },
4 | { "firstName": "michelle", "lastName": "thompson", "city": "seattle" },
5 | { "firstName": "jose", "lastName": "rodriguez", "city": "california" },
6 | { "firstName": "tina", "lastName": "smith", "city": "san francisco" }
7 | ]
--------------------------------------------------------------------------------
/Labs/Using Data Binding and Templates/End/js/ajaxService.js:
--------------------------------------------------------------------------------
1 | var ajaxService = function() {
2 |
3 | this.getJSON = function(url) {
4 | var xhr = new XMLHttpRequest();
5 | xhr.open("GET", url, true);
6 | xhr.setRequestHeader("Accept", "application/json");
7 |
8 | var deferred = Q.defer();
9 |
10 | xhr.onload = function (e) {
11 | if (xhr.readyState === 4) {
12 | if (xhr.status === 200) {
13 | var data = (xhr.responseText) ? JSON.parse(xhr.responseText) : null;
14 | deferred.resolve(data);
15 | } else {
16 | deferred.reject(xhr);
17 | }
18 | }
19 | };
20 |
21 | xhr.onerror = function (e) {
22 | console.error(xhr.statusText);
23 | };
24 |
25 | xhr.send();
26 | return deferred.promise;
27 | };
28 |
29 | return this;
30 |
31 | }();
32 |
33 |
--------------------------------------------------------------------------------
/Labs/Using Data Binding and Templates/End/js/capitalizer.js:
--------------------------------------------------------------------------------
1 | var capitalizer = function() {
2 |
3 | this.capitalize = function(value) {
4 | var upper = value.split(' ').map(function(str) {
5 | return str.charAt(0).toUpperCase() + str.slice(1);
6 | });
7 | return upper.join(' ');
8 | }
9 |
10 | return this;
11 |
12 | }();
13 |
14 |
--------------------------------------------------------------------------------
/Labs/Using Data Binding and Templates/End/js/handlebarsHelper.js:
--------------------------------------------------------------------------------
1 | Handlebars.registerHelper("highlightCity", function (city) {
2 | var highlightedCities = ['Phoenix', 'Seattle', 'Orlando'];
3 | return (highlightedCities.indexOf(city) > -1) ? 'highlight' : '';
4 | });
5 |
--------------------------------------------------------------------------------
/Labs/Using Data Binding and Templates/End/js/tableHelper.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | var TableHelper = function (settings) {
4 | this.data = settings.data;
5 | this.containerId = settings.containerId;
6 | this.templateId = settings.templateId;
7 |
8 | this.render = function () {
9 | if (this.data) {
10 | //Handlebars code goes here
11 | var source = document.getElementById(this.templateId).innerHTML;
12 | var template = Handlebars.compile(source);
13 | document.getElementById(this.containerId).innerHTML = template(this.data);
14 | }
15 | };
16 |
17 | };
18 |
19 |
--------------------------------------------------------------------------------
/Labs/Using Data Binding and Templates/End/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "server",
3 | "version": "1.0.0",
4 | "description": "Used for JavaScript Demos",
5 | "author": "Dan Wahlin",
6 | "dependencies": {
7 | "express": "^4.14.0"
8 | }
9 | }
10 |
--------------------------------------------------------------------------------
/Labs/Using Data Binding and Templates/End/server.js:
--------------------------------------------------------------------------------
1 | var express = require('express');
2 | var app = express();
3 |
4 | app.use(express.static(__dirname));
5 |
6 | app.listen(9000);
7 | console.log('Listening on port 9000');
--------------------------------------------------------------------------------
/Labs/Using Data Binding and Templates/End/styles/styles.css:
--------------------------------------------------------------------------------
1 | table { width: 400px;}
2 | th { text-align:left;}
3 | tbody > tr:nth-child(odd) { background: #efefef; }
4 | .rowCount { margin-top: 10px; }
5 | .highlight { color: green; font-weight:bold;}
--------------------------------------------------------------------------------
/Labs/Using the Prototype Pattern/Begin/car.js:
--------------------------------------------------------------------------------
1 | var miles = 0;
2 | var basePrice = 30000;
3 |
4 | function start() {
5 | miles += 100;
6 | return 'Car Started';
7 | }
8 |
9 | function stop() {
10 | return 'Car Stopped';
11 | }
12 |
13 | function getPricing() {
14 | var tax = basePrice * .08;
15 | var totalPrice = ((basePrice - miles) + tax).toFixed(2);
16 |
17 | //Create an object literal so multiple values can be returned
18 | //using a single object
19 | var total = {
20 | tax: tax,
21 | basePrice: basePrice,
22 | totalPrice: totalPrice
23 | };
24 | return total;
25 | }
26 |
27 | function getMiles() {
28 | return miles;
29 | }
--------------------------------------------------------------------------------
/Labs/Using the Prototype Pattern/Begin/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | Get Car Details
7 |
8 |
Car Details
9 | Car Miles:
10 |
11 | Car Price:
12 |
13 | Car Tax:
14 |
15 | Car Total:
16 |
17 |
18 |
19 |
20 |
41 |
42 |
43 |
--------------------------------------------------------------------------------
/Labs/Using the Prototype Pattern/End/car.js:
--------------------------------------------------------------------------------
1 | var Car = function () {
2 | this.miles = 0;
3 | this.basePrice = 30000;
4 | };
5 |
6 | Car.prototype = {
7 |
8 | start: function () {
9 | this.miles += 100;
10 | return 'Car Started';
11 | },
12 |
13 | stop: function () {
14 | return 'Car Stopped';
15 | },
16 |
17 | getPricing: function () {
18 | var tax = this.basePrice * .08;
19 | var totalPrice = ((this.basePrice - this.miles) + tax).toFixed(2);
20 |
21 | //Create an object literal so multiple values can be returned
22 | //using a single object
23 | var total = {
24 | tax: tax,
25 | basePrice: this.basePrice,
26 | totalPrice: totalPrice
27 | };
28 | return total;
29 | },
30 |
31 | getMiles: function () {
32 | return this.miles;
33 | }
34 | };
--------------------------------------------------------------------------------
/Labs/Using the Prototype Pattern/End/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | Get Car Details
7 |
8 |
Car Details
9 | Car Miles:
10 |
11 | Car Price:
12 |
13 | Car Tax:
14 |
15 | Car Total:
16 |
17 |
18 |
19 |
20 |
21 |
46 |
47 |
48 |
--------------------------------------------------------------------------------
/Labs/Using the Prototype Pattern/End/tests.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
7 |
8 |
9 |
10 |
11 |
27 |
28 |
29 |
--------------------------------------------------------------------------------
/Labs/Using the Revealing Module Pattern/Begin/car.js:
--------------------------------------------------------------------------------
1 | var miles = 0;
2 | var basePrice = 30000;
3 |
4 | function start() {
5 | miles += 100;
6 | return 'Car Started';
7 | }
8 |
9 | function stop() {
10 | return 'Car Stopped';
11 | }
12 |
13 | function getPricing() {
14 | var tax = basePrice * .08;
15 | var totalPrice = ((basePrice - miles) + tax).toFixed(2);
16 |
17 | //Create an object literal so multiple values can be returned
18 | //using a single object
19 | var total = {
20 | tax: tax,
21 | basePrice: basePrice,
22 | totalPrice: totalPrice
23 | };
24 | return total;
25 | }
26 |
27 | function getMiles() {
28 | return miles;
29 | }
--------------------------------------------------------------------------------
/Labs/Using the Revealing Module Pattern/Begin/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | Get Car Details
7 |
8 |
Car Details
9 | Car Miles:
10 |
11 | Car Price:
12 |
13 | Car Tax:
14 |
15 | Car Total:
16 |
17 |
18 |
19 |
20 |
21 |
46 |
47 |
48 |
--------------------------------------------------------------------------------
/Labs/Using the Revealing Module Pattern/Begin/tests.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
7 |
8 |
9 |
10 |
11 |
27 |
28 |
29 |
--------------------------------------------------------------------------------
/Labs/Using the Revealing Module Pattern/End/car.js:
--------------------------------------------------------------------------------
1 | var Car = function () {
2 | var miles = 0,
3 | basePrice = 30000,
4 |
5 | start = function () {
6 | miles += 100;
7 | return 'Car Started';
8 | },
9 |
10 | stop = function () {
11 | return 'Car Stopped';
12 | },
13 |
14 | getPricing = function () {
15 | var tax = basePrice * .08;
16 | var totalPrice = ((basePrice - miles) + tax).toFixed(2);
17 |
18 | //Create an object literal so multiple values can be returned
19 | //using a single object
20 | var total = {
21 | tax: tax,
22 | basePrice: basePrice,
23 | totalPrice: totalPrice
24 | };
25 | return total;
26 | },
27 |
28 | getMiles = function () {
29 | return miles;
30 | };
31 |
32 | return {
33 | start: start,
34 | stop: stop,
35 | getPricing: getPricing,
36 | getMiles: getMiles
37 | };
38 | };
--------------------------------------------------------------------------------
/Labs/Using the Revealing Module Pattern/End/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Get Car Details
6 |
7 |
Car Details
8 | Car Miles:
9 |
10 | Car Price:
11 |
12 | Car Tax:
13 |
14 | Car Total:
15 |
16 |
17 |
18 |
19 |
20 |
44 |
45 |
46 |
--------------------------------------------------------------------------------
/Labs/Using the Revealing Module Pattern/End/tests.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
7 |
8 |
9 |
10 |
11 |
27 |
28 |
29 |
--------------------------------------------------------------------------------
/Labs/Using the Revealing Prototype Pattern/Begin/car.js:
--------------------------------------------------------------------------------
1 | var miles = 0;
2 | var basePrice = 30000;
3 |
4 | function start() {
5 | miles += 100;
6 | return 'Car Started';
7 | }
8 |
9 | function stop() {
10 | return 'Car Stopped';
11 | }
12 |
13 | function getPricing() {
14 | var tax = basePrice * .08;
15 | var totalPrice = ((basePrice - miles) + tax).toFixed(2);
16 |
17 | //Create an object literal so multiple values can be returned
18 | //using a single object
19 | var total = {
20 | tax: tax,
21 | basePrice: basePrice,
22 | totalPrice: totalPrice
23 | };
24 | return total;
25 | }
26 |
27 | function getMiles() {
28 | return miles;
29 | }
--------------------------------------------------------------------------------
/Labs/Using the Revealing Prototype Pattern/Begin/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | Get Car Details
7 |
8 |
Car Details
9 | Car Miles:
10 |
11 | Car Price:
12 |
13 | Car Tax:
14 |
15 | Car Total:
16 |
17 |
18 |
19 |
20 |
21 |
41 |
42 |
43 |
--------------------------------------------------------------------------------
/Labs/Using the Revealing Prototype Pattern/Begin/tests.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
7 |
8 |
9 |
10 |
11 |
27 |
28 |
29 |
--------------------------------------------------------------------------------
/Labs/Using the Revealing Prototype Pattern/End/car.js:
--------------------------------------------------------------------------------
1 | var Car = function () {
2 | this.miles = 0;
3 | this.basePrice = 30000;
4 | };
5 |
6 | Car.prototype = function() {
7 |
8 | var start = function () {
9 | this.miles += 100;
10 | return 'Car Started';
11 | },
12 |
13 | stop = function () {
14 | return 'Car Stopped';
15 | },
16 |
17 | getPricing = function () {
18 | var tax = this.basePrice * .08;
19 | var totalPrice = ((this.basePrice - this.miles) + tax).toFixed(2);
20 |
21 | //Create an object literal so multiple values can be returned
22 | //using a single object
23 | var total = {
24 | tax: tax,
25 | basePrice: this.basePrice,
26 | totalPrice: totalPrice
27 | };
28 | return total;
29 | },
30 |
31 | getMiles = function () {
32 | return this.miles;
33 | };
34 |
35 | return {
36 | start: start,
37 | stop: stop,
38 | getPricing: getPricing,
39 | getMiles: getMiles
40 | }
41 | }();
--------------------------------------------------------------------------------
/Labs/Using the Revealing Prototype Pattern/End/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | Get Car Details
7 |
8 |
Car Details
9 | Car Miles:
10 |
11 | Car Price:
12 |
13 | Car Tax:
14 |
15 | Car Total:
16 |
17 |
18 |
19 |
20 |
21 |
47 |
48 |
49 |
--------------------------------------------------------------------------------
/Labs/Using the Revealing Prototype Pattern/End/tests.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
7 |
8 |
9 |
10 |
11 |
27 |
28 |
29 |
--------------------------------------------------------------------------------
/Labs/Working with ES2015/Begin/.babelrc:
--------------------------------------------------------------------------------
1 | {
2 | "presets": ["@babel/preset-env"]
3 | }
--------------------------------------------------------------------------------
/Labs/Working with ES2015/Begin/gulpfile.js:
--------------------------------------------------------------------------------
1 | var gulp = require('gulp'),
2 | babel = require('gulp-babel'),
3 | es2015Path = 'js/*.js',
4 | compilePath = 'js/compiled';
5 |
6 |
7 |
8 |
9 |
10 |
11 | gulp.task('watch', function() {
12 | gulp.watch(es2015Path, gulp.series('babel'));
13 | });
14 |
15 | gulp.task('default', gulp.series('babel', 'watch'));
16 |
--------------------------------------------------------------------------------
/Labs/Working with ES2015/Begin/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Building Custom ES2015 JavaScript Objects
5 |
6 |
7 | Automobiles
8 |
9 |
10 |
11 |
12 |
13 |
17 |
18 |
--------------------------------------------------------------------------------
/Labs/Working with ES2015/Begin/js/autos.js:
--------------------------------------------------------------------------------
1 | var Auto = function() {}
2 |
3 | Auto.prototype.getTotal = function(taxRate) {
4 | return this.price + (this.price * taxRate);
5 | }
6 |
7 | Auto.prototype.getDetails = function() {
8 | return this.year + ' ' + this.make + ' ' + this.model;
9 | }
10 |
11 | var Car = function(data) {
12 | this.make = data.make;
13 | this.model = data.model;
14 | this.year = data.year;
15 | this.price = data.price;
16 | this.isElectric = data.isElectric;
17 | this.isHatchback = data.isHatchback;
18 | };
19 |
20 | Car.prototype = Object.create(Auto.prototype);
21 |
22 | Car.prototype.getDetails = function () {
23 | var details = Auto.prototype.getDetails.call(this);
24 | return details + ' Electric: ' + this.isElectric +
25 | ' Hatchback: ' + this.isHatchback;
26 | };
27 |
28 | var Truck = function(data) {
29 | this.make = data.make;
30 | this.model = data.model;
31 | this.year = data.year;
32 | this.price = data.price;
33 | this.is4by4 = data.is4by4;
34 | };
35 |
36 | Truck.prototype = Object.create(Auto.prototype);
37 |
38 | Truck.prototype.getDetails = function () {
39 | var details = Auto.prototype.getDetails.call(this);
40 | return details + ' 4X4: ' + this.is4by4;
41 | };
42 |
--------------------------------------------------------------------------------
/Labs/Working with ES2015/Begin/js/compiled/babel/.gitkeep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DanWahlin/MasteringJavaScriptCourseCode/f1943ad51260d83f8cec70367fd321bf277fdc52/Labs/Working with ES2015/Begin/js/compiled/babel/.gitkeep
--------------------------------------------------------------------------------
/Labs/Working with ES2015/Begin/js/compiled/traceur/.gitkeep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DanWahlin/MasteringJavaScriptCourseCode/f1943ad51260d83f8cec70367fd321bf277fdc52/Labs/Working with ES2015/Begin/js/compiled/traceur/.gitkeep
--------------------------------------------------------------------------------
/Labs/Working with ES2015/Begin/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "jsdemos",
3 | "version": "1.0.0",
4 | "description": "Used for JavaScript Demos",
5 | "author": "Dan Wahlin",
6 | "dependencies": {
7 | "express": "^4.14.0"
8 | },
9 | "devDependencies": {
10 | "@babel/core": "^7.2.2",
11 | "@babel/preset-env": "^7.2.3",
12 | "gulp": "^4.0.0",
13 | "gulp-babel": "^8.0.0",
14 | "gulp-sourcemaps": "^2.6.4"
15 | }
16 | }
17 |
--------------------------------------------------------------------------------
/Labs/Working with ES2015/End/.babelrc:
--------------------------------------------------------------------------------
1 | {
2 | "presets": ["@babel/preset-env"]
3 | }
--------------------------------------------------------------------------------
/Labs/Working with ES2015/End/gulpfile.js:
--------------------------------------------------------------------------------
1 | var gulp = require('gulp'),
2 | babel = require('gulp-babel'),
3 | es2015Path = 'js/*.js',
4 | compilePath = 'js/compiled';
5 |
6 | gulp.task('babel', function () {
7 | return gulp.src([es2015Path])
8 | .pipe(babel({
9 | presets: ['@babel/env']
10 | }))
11 | .pipe(gulp.dest(compilePath + '/babel'));
12 | });
13 |
14 | gulp.task('watch', function() {
15 | gulp.watch(es2015Path, gulp.series('babel'));
16 | });
17 |
18 | gulp.task('default', gulp.series('babel', 'watch'));
19 |
--------------------------------------------------------------------------------
/Labs/Working with ES2015/End/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Building Custom ES2015 JavaScript Objects
5 |
6 |
7 | Automobiles
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
35 |
36 |
37 |
--------------------------------------------------------------------------------
/Labs/Working with ES2015/End/js/autos.js:
--------------------------------------------------------------------------------
1 | class Auto {
2 |
3 | constructor(data) {
4 | this.make = data.make;
5 | this.model = data.model;
6 | this.year = data.year;
7 | this.price = data.price;
8 | }
9 |
10 | getTotal(taxRate) {
11 | return this.price + (this.price * taxRate);
12 | }
13 |
14 | getDetails() {
15 | return this.year + ' ' + this.make + ' ' + this.model;
16 | }
17 |
18 | }
19 |
20 | class Car extends Auto {
21 |
22 | constructor(data) {
23 | super(data);
24 | this.isElectric = data.isElectric;
25 | this.isHatchback = data.isHatchback;
26 | }
27 |
28 | getDetails() {
29 | var details = super.getDetails();
30 | return details + ' Electric: ' + this.isElectric +
31 | ' Hatchback: ' + this.isHatchback;
32 | }
33 | }
34 |
35 |
36 | class Truck extends Auto {
37 |
38 | constructor(data) {
39 | super(data);
40 | this.is4by4 = data.is4by4;
41 | }
42 |
43 | getDetails() {
44 | var details = super.getDetails();
45 | return details + ' 4X4: ' + this.is4by4;
46 | }
47 |
48 | }
49 |
--------------------------------------------------------------------------------
/Labs/Working with ES2015/End/js/compiled/babel/.gitkeep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DanWahlin/MasteringJavaScriptCourseCode/f1943ad51260d83f8cec70367fd321bf277fdc52/Labs/Working with ES2015/End/js/compiled/babel/.gitkeep
--------------------------------------------------------------------------------
/Labs/Working with ES2015/End/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "jsdemos",
3 | "version": "1.0.0",
4 | "description": "Used for JavaScript Demos",
5 | "author": "Dan Wahlin",
6 | "dependencies": {
7 | "express": "^4.14.0"
8 | },
9 | "devDependencies": {
10 | "@babel/core": "^7.2.2",
11 | "@babel/preset-env": "^7.2.3",
12 | "gulp": "^4.0.0",
13 | "gulp-babel": "^8.0.0",
14 | "gulp-sourcemaps": "^2.6.4"
15 | }
16 | }
17 |
--------------------------------------------------------------------------------
/Labs/Working with Functions/Begin/data.json.txt:
--------------------------------------------------------------------------------
1 | [
2 | { "firstName": "jane", "lastName": "doe", "city": "phoenix" },
3 | { "firstName": "john", "lastName": "doe", "city": "phoenix" },
4 | { "firstName": "michelle", "lastName": "thompson", "city": "seattle" },
5 | { "firstName": "jose", "lastName": "rodriguez", "city": "california" },
6 | { "firstName": "tina", "lastName": "smith", "city": "san francisco" }
7 | ]
--------------------------------------------------------------------------------
/Labs/Working with Functions/Begin/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Working with Functions
5 |
6 |
7 |
8 | Customer Data
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
22 |
23 |
24 |
--------------------------------------------------------------------------------
/Labs/Working with Functions/Begin/js/ajaxService.js:
--------------------------------------------------------------------------------
1 |
2 |
--------------------------------------------------------------------------------
/Labs/Working with Functions/Begin/js/capitalizer.js:
--------------------------------------------------------------------------------
1 |
2 |
--------------------------------------------------------------------------------
/Labs/Working with Functions/Begin/js/tableHelper.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | var TableHelper = function (settings) {
4 | this.data = settings.data;
5 | this.columnMap = settings.columnMap;
6 | this.containerId = settings.containerId;
7 | var table = '';
9 |
10 | this.render = function () {
11 | if (this.data && this.data.length) {
12 | //Change caller to TableHelper instance
13 |
14 | }
15 | };
16 |
17 | var renderHeader = function (renderThead) {
18 | var tr = '';
19 | for (var prop in this.data[0]) {
20 | tr += '' + getColumnName.call(this, prop) + ' ';
21 | }
22 | tr += ' ';
23 | if (renderThead) tr = '' + tr + ' ';
24 | return tr;
25 | },
26 |
27 | renderRows = function (renderTbody) {
28 | var rows = '';
29 | for (var i = 0, len = this.data.length; i < len; i++) {
30 | rows += '';
31 | var row = this.data[i];
32 | for (var prop in row) {
33 | rows += '' + row[prop] + ' ';
34 | }
35 | rows += ' ';
36 | }
37 | if (renderTbody) rows = '' + rows + ' ';
38 | return rows;
39 | },
40 |
41 | renderTable = function () {
42 | var container = document.getElementById(this.containerId);
43 | if (container) {
44 | table += '' + this.data.length + ' rows
';
45 | container.innerHTML = table;
46 | }
47 | },
48 |
49 | //Add getColumnName() here
50 |
51 |
52 |
53 | };
54 |
55 |
--------------------------------------------------------------------------------
/Labs/Working with Functions/Begin/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Server",
3 | "version": "1.0.0",
4 | "description": "Used for JavaScript Demos",
5 | "author": "Dan Wahlin",
6 | "engines": {
7 | "node": ">=0.10.28"
8 | },
9 | "dependencies": {
10 | "express": "^4.9.6"
11 | }
12 | }
13 |
--------------------------------------------------------------------------------
/Labs/Working with Functions/Begin/server.js:
--------------------------------------------------------------------------------
1 | var express = require('express');
2 | var app = express();
3 |
4 | app.use(express.static(__dirname));
5 |
6 | app.listen(9000);
7 | console.log('Listening on port 9000');
--------------------------------------------------------------------------------
/Labs/Working with Functions/Begin/styles/styles.css:
--------------------------------------------------------------------------------
1 | table { width: 400px;}
2 | th { text-align:left;}
3 | tbody > tr:nth-child(odd) { background: #efefef; }
4 | .rowCount { margin-top: 10px; }
--------------------------------------------------------------------------------
/Labs/Working with Functions/End/data.json.txt:
--------------------------------------------------------------------------------
1 | [
2 | { "firstName": "jane", "lastName": "doe", "city": "phoenix" },
3 | { "firstName": "john", "lastName": "doe", "city": "phoenix" },
4 | { "firstName": "michelle", "lastName": "thompson", "city": "seattle" },
5 | { "firstName": "jose", "lastName": "rodriguez", "city": "california" },
6 | { "firstName": "tina", "lastName": "smith", "city": "san francisco" }
7 | ]
--------------------------------------------------------------------------------
/Labs/Working with Functions/End/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Working with Functions
5 |
6 |
7 |
8 | Customer Data
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
46 |
47 |
48 |
--------------------------------------------------------------------------------
/Labs/Working with Functions/End/js/ajaxService.js:
--------------------------------------------------------------------------------
1 | var ajaxService = function() {
2 |
3 | this.getJSON = function(url) {
4 | var xhr = new XMLHttpRequest();
5 | xhr.open("GET", url, true);
6 | xhr.setRequestHeader("Accept", "application/json");
7 |
8 | var deferred = Q.defer();
9 |
10 | xhr.onload = function (e) {
11 | if (xhr.readyState === 4) {
12 | if (xhr.status === 200) {
13 | var data = (xhr.responseText) ? JSON.parse(xhr.responseText) : null;
14 | deferred.resolve(data);
15 | } else {
16 | deferred.reject(xhr);
17 | }
18 | }
19 | };
20 |
21 | xhr.onerror = function (e) {
22 | console.error(xhr.statusText);
23 | };
24 |
25 | xhr.send();
26 | return deferred.promise;
27 | };
28 |
29 | return this;
30 |
31 | }();
32 |
33 |
--------------------------------------------------------------------------------
/Labs/Working with Functions/End/js/capitalizer.js:
--------------------------------------------------------------------------------
1 | var capitalizer = function() {
2 |
3 | this.capitalize = function(value) {
4 | var upper = value.split(' ').map(function(str) {
5 | return str.charAt(0).toUpperCase() + str.slice(1);
6 | });
7 | return upper.join(' ');
8 | }
9 |
10 | return this;
11 |
12 | }();
13 |
14 |
--------------------------------------------------------------------------------
/Labs/Working with Functions/End/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Server",
3 | "version": "1.0.0",
4 | "description": "Used for JavaScript Demos",
5 | "author": "Dan Wahlin",
6 | "engines": {
7 | "node": ">=0.10.28"
8 | },
9 | "dependencies": {
10 | "express": "^4.9.6"
11 | }
12 | }
13 |
--------------------------------------------------------------------------------
/Labs/Working with Functions/End/server.js:
--------------------------------------------------------------------------------
1 | var express = require('express');
2 | var app = express();
3 |
4 | app.use(express.static(__dirname));
5 |
6 | app.listen(9000);
7 | console.log('Listening on port 9000');
--------------------------------------------------------------------------------
/Labs/Working with Functions/End/styles/styles.css:
--------------------------------------------------------------------------------
1 | table { width: 400px;}
2 | th { text-align:left;}
3 | tbody > tr:nth-child(odd) { background: #efefef; }
4 | .rowCount { margin-top: 10px; }
--------------------------------------------------------------------------------
/Mastering JavaScript/.babelrc:
--------------------------------------------------------------------------------
1 | {
2 | "presets": ["@babel/preset-env"]
3 | }
--------------------------------------------------------------------------------
/Mastering JavaScript/gulpfile.js:
--------------------------------------------------------------------------------
1 | var gulp = require('gulp'),
2 | sourcemaps = require('gulp-sourcemaps'),
3 | babel = require('gulp-babel'),
4 | ts = require('gulp-typescript'),
5 | uglify = require('gulp-uglify'),
6 | concat = require('gulp-concat'),
7 | plumber = require('gulp-plumber'),
8 | es2015Path = 'samples/es6/*.js',
9 | tsPath = 'samples/typescript/*.ts',
10 | compilePath = 'js/compiled',
11 | dist = 'js/dist';
12 |
13 | gulp.task('compressScripts', function () {
14 | gulp.src([
15 | compilePath + '/babel/*.js'
16 | ])
17 | .pipe(plumber())
18 | .pipe(concat('scripts.min.js'))
19 | .pipe(uglify())
20 | .pipe(gulp.dest(dist));
21 | });
22 |
23 | gulp.task('babel', function () {
24 | return gulp.src([es2015Path])
25 | .pipe(plumber())
26 | .pipe(sourcemaps.init())
27 | .pipe(babel({
28 | presets: ['@babel/env']
29 | }))
30 | .pipe(sourcemaps.write('.'))
31 | .pipe(gulp.dest(compilePath + '/babel'));
32 | });
33 |
34 | gulp.task('typescript', function () {
35 | var tsResult = gulp.src(tsPath)
36 | .pipe(ts({
37 | target: 'ES5',
38 | declarationFiles: false,
39 | noResolve: true
40 | }));
41 |
42 | tsResult.dts.pipe(gulp.dest(compilePath + '/tsdefinitions'));
43 | return tsResult.js.pipe(gulp.dest(compilePath + '/typescript'));
44 | });
45 |
46 | gulp.task('watch', function() {
47 |
48 | gulp.watch([es2015Path,tsPath], gulp.series('babel', 'typescript'));
49 |
50 | });
51 |
52 | gulp.task('default', gulp.series('babel', 'typescript', 'watch', 'compressScripts'));
53 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/ext-error_marker.js:
--------------------------------------------------------------------------------
1 |
2 | ;
3 | (function() {
4 | window.require(["ace/ext/error_marker"], function() {});
5 | })();
6 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/ext-linking.js:
--------------------------------------------------------------------------------
1 | define("ace/ext/linking",["require","exports","module","ace/editor","ace/config"], function(require, exports, module) {
2 |
3 | var Editor = require("ace/editor").Editor;
4 |
5 | require("../config").defineOptions(Editor.prototype, "editor", {
6 | enableLinking: {
7 | set: function(val) {
8 | if (val) {
9 | this.on("click", onClick);
10 | this.on("mousemove", onMouseMove);
11 | } else {
12 | this.off("click", onClick);
13 | this.off("mousemove", onMouseMove);
14 | }
15 | },
16 | value: false
17 | }
18 | })
19 |
20 | function onMouseMove(e) {
21 | var editor = e.editor;
22 | var ctrl = e.getAccelKey();
23 |
24 | if (ctrl) {
25 | var editor = e.editor;
26 | var docPos = e.getDocumentPosition();
27 | var session = editor.session;
28 | var token = session.getTokenAt(docPos.row, docPos.column);
29 |
30 | editor._emit("linkHover", {position: docPos, token: token});
31 | }
32 | }
33 |
34 | function onClick(e) {
35 | var ctrl = e.getAccelKey();
36 | var button = e.getButton();
37 |
38 | if (button == 0 && ctrl) {
39 | var editor = e.editor;
40 | var docPos = e.getDocumentPosition();
41 | var session = editor.session;
42 | var token = session.getTokenAt(docPos.row, docPos.column);
43 |
44 | editor._emit("linkClick", {position: docPos, token: token});
45 | }
46 | }
47 |
48 | });
49 | ;
50 | (function() {
51 | window.require(["ace/ext/linking"], function() {});
52 | })();
53 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/mode-gitignore.js:
--------------------------------------------------------------------------------
1 | define("ace/mode/gitignore_highlight_rules",["require","exports","module","ace/lib/oop","ace/mode/text_highlight_rules"], function(require, exports, module) {
2 | "use strict";
3 |
4 | var oop = require("../lib/oop");
5 | var TextHighlightRules = require("./text_highlight_rules").TextHighlightRules;
6 |
7 | var GitignoreHighlightRules = function() {
8 | this.$rules = {
9 | "start" : [
10 | {
11 | token : "comment",
12 | regex : /^\s*#.*$/
13 | }, {
14 | token : "keyword", // negated patterns
15 | regex : /^\s*!.*$/
16 | }
17 | ]
18 | };
19 |
20 | this.normalizeRules();
21 | };
22 |
23 | GitignoreHighlightRules.metaData = {
24 | fileTypes: ['gitignore'],
25 | name: 'Gitignore'
26 | };
27 |
28 | oop.inherits(GitignoreHighlightRules, TextHighlightRules);
29 |
30 | exports.GitignoreHighlightRules = GitignoreHighlightRules;
31 | });
32 |
33 | define("ace/mode/gitignore",["require","exports","module","ace/lib/oop","ace/mode/text","ace/mode/gitignore_highlight_rules"], function(require, exports, module) {
34 | "use strict";
35 |
36 | var oop = require("../lib/oop");
37 | var TextMode = require("./text").Mode;
38 | var GitignoreHighlightRules = require("./gitignore_highlight_rules").GitignoreHighlightRules;
39 |
40 | var Mode = function() {
41 | this.HighlightRules = GitignoreHighlightRules;
42 | };
43 | oop.inherits(Mode, TextMode);
44 |
45 | (function() {
46 | this.$id = "ace/mode/gitignore";
47 | }).call(Mode.prototype);
48 |
49 | exports.Mode = Mode;
50 | });
51 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/mode-plain_text.js:
--------------------------------------------------------------------------------
1 | define("ace/mode/plain_text",["require","exports","module","ace/lib/oop","ace/mode/text","ace/mode/text_highlight_rules","ace/mode/behaviour"], function(require, exports, module) {
2 | "use strict";
3 |
4 | var oop = require("../lib/oop");
5 | var TextMode = require("./text").Mode;
6 | var TextHighlightRules = require("./text_highlight_rules").TextHighlightRules;
7 | var Behaviour = require("./behaviour").Behaviour;
8 |
9 | var Mode = function() {
10 | this.HighlightRules = TextHighlightRules;
11 | this.$behaviour = new Behaviour();
12 | };
13 |
14 | oop.inherits(Mode, TextMode);
15 |
16 | (function() {
17 | this.type = "text";
18 | this.getNextLineIndent = function(state, line, tab) {
19 | return '';
20 | };
21 | this.$id = "ace/mode/plain_text";
22 | }).call(Mode.prototype);
23 |
24 | exports.Mode = Mode;
25 | });
26 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/mode-text.js:
--------------------------------------------------------------------------------
1 |
2 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/abap.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/abap",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "abap";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/ada.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/ada",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "ada";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/apache_conf.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/apache_conf",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "apache_conf";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/applescript.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/applescript",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "applescript";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/asciidoc.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/asciidoc",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "asciidoc";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/assembly_x86.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/assembly_x86",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "assembly_x86";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/autohotkey.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/autohotkey",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "autohotkey";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/batchfile.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/batchfile",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "batchfile";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/c9search.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/c9search",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "c9search";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/cirru.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/cirru",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "cirru";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/cobol.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/cobol",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "cobol";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/coldfusion.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/coldfusion",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "coldfusion";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/csharp.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/csharp",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "csharp";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/curly.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/curly",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "curly";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/d.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/d",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "d";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/diff.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/diff",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText = "# DEP-3 (http://dep.debian.net/deps/dep3/) style patch header\n\
5 | snippet header DEP-3 style header\n\
6 | Description: ${1}\n\
7 | Origin: ${2:vendor|upstream|other}, ${3:url of the original patch}\n\
8 | Bug: ${4:url in upstream bugtracker}\n\
9 | Forwarded: ${5:no|not-needed|url}\n\
10 | Author: ${6:`g:snips_author`}\n\
11 | Reviewed-by: ${7:name and email}\n\
12 | Last-Update: ${8:`strftime(\"%Y-%m-%d\")`}\n\
13 | Applied-Upstream: ${9:upstream version|url|commit}\n\
14 | \n\
15 | ";
16 | exports.scope = "diff";
17 |
18 | });
19 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/dockerfile.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/dockerfile",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "dockerfile";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/dot.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/dot",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "dot";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/eiffel.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/eiffel",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "eiffel";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/ejs.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/ejs",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "ejs";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/forth.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/forth",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "forth";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/ftl.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/ftl",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "ftl";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/gcode.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/gcode",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "gcode";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/gherkin.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/gherkin",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "gherkin";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/gitignore.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/gitignore",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "gitignore";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/glsl.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/glsl",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "glsl";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/golang.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/golang",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "golang";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/groovy.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/groovy",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "groovy";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/haml.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/haml",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText = "snippet t\n\
5 | %table\n\
6 | %tr\n\
7 | %th\n\
8 | ${1:headers}\n\
9 | %tr\n\
10 | %td\n\
11 | ${2:headers}\n\
12 | snippet ul\n\
13 | %ul\n\
14 | %li\n\
15 | ${1:item}\n\
16 | %li\n\
17 | snippet =rp\n\
18 | = render :partial => '${1:partial}'\n\
19 | snippet =rpl\n\
20 | = render :partial => '${1:partial}', :locals => {}\n\
21 | snippet =rpc\n\
22 | = render :partial => '${1:partial}', :collection => @$1\n\
23 | \n\
24 | ";
25 | exports.scope = "haml";
26 |
27 | });
28 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/handlebars.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/handlebars",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "handlebars";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/haxe.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/haxe",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "haxe";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/html_ruby.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/html_ruby",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "html_ruby";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/ini.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/ini",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "ini";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/jack.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/jack",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "jack";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/jade.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/jade",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "jade";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/json.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/json",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "json";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/jsx.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/jsx",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "jsx";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/julia.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/julia",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "julia";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/latex.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/latex",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "latex";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/less.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/less",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "less";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/liquid.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/liquid",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "liquid";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/lisp.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/lisp",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "lisp";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/livescript.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/livescript",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "livescript";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/logiql.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/logiql",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "logiql";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/lua.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/lua",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText = "snippet #!\n\
5 | #!/usr/bin/env lua\n\
6 | $1\n\
7 | snippet local\n\
8 | local ${1:x} = ${2:1}\n\
9 | snippet fun\n\
10 | function ${1:fname}(${2:...})\n\
11 | ${3:-- body}\n\
12 | end\n\
13 | snippet for\n\
14 | for ${1:i}=${2:1},${3:10} do\n\
15 | ${4:print(i)}\n\
16 | end\n\
17 | snippet forp\n\
18 | for ${1:i},${2:v} in pairs(${3:table_name}) do\n\
19 | ${4:-- body}\n\
20 | end\n\
21 | snippet fori\n\
22 | for ${1:i},${2:v} in ipairs(${3:table_name}) do\n\
23 | ${4:-- body}\n\
24 | end\n\
25 | ";
26 | exports.scope = "lua";
27 |
28 | });
29 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/luapage.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/luapage",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "luapage";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/lucene.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/lucene",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "lucene";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/makefile.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/makefile",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText = "snippet ifeq\n\
5 | ifeq (${1:cond0},${2:cond1})\n\
6 | ${3:code}\n\
7 | endif\n\
8 | ";
9 | exports.scope = "makefile";
10 |
11 | });
12 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/matlab.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/matlab",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "matlab";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/mel.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/mel",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "mel";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/mushcode.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/mushcode",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "mushcode";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/mysql.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/mysql",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "mysql";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/nix.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/nix",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "nix";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/objectivec.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/objectivec",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "objectivec";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/ocaml.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/ocaml",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "ocaml";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/pascal.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/pascal",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "pascal";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/pgsql.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/pgsql",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "pgsql";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/plain_text.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/plain_text",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "plain_text";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/powershell.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/powershell",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "powershell";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/praat.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/praat",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "praat";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/prolog.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/prolog",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "prolog";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/properties.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/properties",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "properties";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/protobuf.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/protobuf",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText = "";
5 | exports.scope = "protobuf";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/rdoc.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/rdoc",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "rdoc";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/rhtml.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/rhtml",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "rhtml";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/rust.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/rust",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "rust";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/sass.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/sass",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "sass";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/scad.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/scad",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "scad";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/scala.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/scala",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "scala";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/scheme.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/scheme",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "scheme";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/scss.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/scss",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "scss";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/sjs.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/sjs",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "sjs";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/smarty.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/smarty",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "smarty";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/snippets.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/snippets",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText = "# snippets for making snippets :)\n\
5 | snippet snip\n\
6 | snippet ${1:trigger}\n\
7 | ${2}\n\
8 | snippet msnip\n\
9 | snippet ${1:trigger} ${2:description}\n\
10 | ${3}\n\
11 | snippet v\n\
12 | {VISUAL}\n\
13 | ";
14 | exports.scope = "snippets";
15 |
16 | });
17 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/soy_template.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/soy_template",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "soy_template";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/space.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/space",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "space";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/sql.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/sql",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText = "snippet tbl\n\
5 | create table ${1:table} (\n\
6 | ${2:columns}\n\
7 | );\n\
8 | snippet col\n\
9 | ${1:name} ${2:type} ${3:default ''} ${4:not null}\n\
10 | snippet ccol\n\
11 | ${1:name} varchar2(${2:size}) ${3:default ''} ${4:not null}\n\
12 | snippet ncol\n\
13 | ${1:name} number ${3:default 0} ${4:not null}\n\
14 | snippet dcol\n\
15 | ${1:name} date ${3:default sysdate} ${4:not null}\n\
16 | snippet ind\n\
17 | create index ${3:$1_$2} on ${1:table}(${2:column});\n\
18 | snippet uind\n\
19 | create unique index ${1:name} on ${2:table}(${3:column});\n\
20 | snippet tblcom\n\
21 | comment on table ${1:table} is '${2:comment}';\n\
22 | snippet colcom\n\
23 | comment on column ${1:table}.${2:column} is '${3:comment}';\n\
24 | snippet addcol\n\
25 | alter table ${1:table} add (${2:column} ${3:type});\n\
26 | snippet seq\n\
27 | create sequence ${1:name} start with ${2:1} increment by ${3:1} minvalue ${4:1};\n\
28 | snippet s*\n\
29 | select * from ${1:table}\n\
30 | ";
31 | exports.scope = "sql";
32 |
33 | });
34 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/stylus.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/stylus",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "stylus";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/svg.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/svg",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "svg";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/text.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/text",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "text";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/textile.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/textile",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText = "# Jekyll post header\n\
5 | snippet header\n\
6 | ---\n\
7 | title: ${1:title}\n\
8 | layout: post\n\
9 | date: ${2:date} ${3:hour:minute:second} -05:00\n\
10 | ---\n\
11 | \n\
12 | # Image\n\
13 | snippet img\n\
14 | !${1:url}(${2:title}):${3:link}!\n\
15 | \n\
16 | # Table\n\
17 | snippet |\n\
18 | |${1}|${2}\n\
19 | \n\
20 | # Link\n\
21 | snippet link\n\
22 | \"${1:link text}\":${2:url}\n\
23 | \n\
24 | # Acronym\n\
25 | snippet (\n\
26 | (${1:Expand acronym})${2}\n\
27 | \n\
28 | # Footnote\n\
29 | snippet fn\n\
30 | [${1:ref number}] ${3}\n\
31 | \n\
32 | fn$1. ${2:footnote}\n\
33 | \n\
34 | ";
35 | exports.scope = "textile";
36 |
37 | });
38 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/toml.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/toml",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "toml";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/twig.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/twig",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "twig";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/typescript.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/typescript",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "typescript";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/vbscript.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/vbscript",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "vbscript";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/velocity.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/velocity",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText = "# macro\n\
5 | snippet #macro\n\
6 | #macro ( ${1:macroName} ${2:\\$var1, [\\$var2, ...]} )\n\
7 | ${3:## macro code}\n\
8 | #end\n\
9 | # foreach\n\
10 | snippet #foreach\n\
11 | #foreach ( ${1:\\$item} in ${2:\\$collection} )\n\
12 | ${3:## foreach code}\n\
13 | #end\n\
14 | # if\n\
15 | snippet #if\n\
16 | #if ( ${1:true} )\n\
17 | ${0}\n\
18 | #end\n\
19 | # if ... else\n\
20 | snippet #ife\n\
21 | #if ( ${1:true} )\n\
22 | ${2}\n\
23 | #else\n\
24 | ${0}\n\
25 | #end\n\
26 | #import\n\
27 | snippet #import\n\
28 | #import ( \"${1:path/to/velocity/format}\" )\n\
29 | # set\n\
30 | snippet #set\n\
31 | #set ( $${1:var} = ${0} )\n\
32 | ";
33 | exports.scope = "velocity";
34 | exports.includeScopes = ["html", "javascript", "css"];
35 |
36 | });
37 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/verilog.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/verilog",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "verilog";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/vhdl.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/vhdl",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "vhdl";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/xml.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/xml",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "xml";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/ace/snippets/yaml.js:
--------------------------------------------------------------------------------
1 | define("ace/snippets/yaml",["require","exports","module"], function(require, exports, module) {
2 | "use strict";
3 |
4 | exports.snippetText =undefined;
5 | exports.scope = "yaml";
6 |
7 | });
8 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/compiled/babel/arrowFunctions.js.map:
--------------------------------------------------------------------------------
1 | {"version":3,"sources":["arrowFunctions.js"],"names":[],"mappings":";;;;;;AAAA,IAAI,WAAW,SAAX,QAAW;AAAA,WAAO,QAAQ,GAAR,CAAY,GAAZ,CAAP;AAAA,CAAf,C;;AAEA,SAAS,8BAAT;;;AAGA,SAAS,GAAT,GAAe;AACX,QAAI,OAAO,IAAX;AACA,SAAK,MAAL,GAAc,CAAd;;AAEA,SAAK,OAAL,GAAe,YAAW;AACtB,mBAAW,YAAW;AAClB,oBAAQ,GAAR,CAAY,KAAK,MAAL,EAAZ;AACH,SAFD,EAEG,IAFH;AAGH,KAJD;AAKH;;;;IAGK,Y;AAEF,4BAAc;AAAA;;AACV,aAAK,MAAL,GAAc,CAAd;AACH;;;;kCAES;AAAA;;AACN,uBAAW,YAAM;AACb,wBAAQ,GAAR,CAAY,MAAK,MAAL,EAAZ;AACH,aAFD,EAEG,IAFH;AAGH;;;;;;AAGL,IAAI,IAAI,IAAI,GAAJ,EAAR;AACA,EAAE,OAAF;AACA,IAAI,SAAS,IAAI,YAAJ,EAAb;AACA,OAAO,OAAP","file":"arrowFunctions.js","sourcesContent":["var myLogger = msg => console.log(msg); //Creates an anonymous function\r\n\r\nmyLogger('Testing out arrow functions!');\r\n\r\n//Working with \"this\" the \"old\" way\r\nfunction Car() {\r\n var self = this;\r\n this._seats = 4; \r\n\r\n this.timeout = function() {\r\n setTimeout(function() {\r\n console.log(self._seats++);\r\n }, 1000);\r\n }\r\n}\r\n\r\n//Working with this using arrow functions\r\nclass CarWithArrow {\r\n\r\n constructor() {\r\n this._seats = 6;\r\n }\r\n\r\n timeout() {\r\n setTimeout(() => {\r\n console.log(this._seats++);\r\n }, 1000);\r\n }\r\n}\r\n\r\nvar c = new Car();\r\nc.timeout();\r\nvar cArrow = new CarWithArrow();\r\ncArrow.timeout();"],"sourceRoot":"/source/"}
--------------------------------------------------------------------------------
/Mastering JavaScript/js/compiled/babel/classes.js.map:
--------------------------------------------------------------------------------
1 | {"version":3,"sources":["classes.js"],"names":[],"mappings":";;;;;;;;;;;;IAAM,O;AACF,uBAAc;AAAA;;AACV,aAAK,OAAL,GAAe,MAAf;AACH;;;;4BAEG,G,EAAK;AACL,oBAAQ,GAAR,CAAY,KAAK,OAAL,GAAe,IAAf,GAAsB,GAAlC;AACH;;;;;;IAGC,M;;;AAEF,oBAAY,OAAZ,EAAqB;AAAA;;AAAA,yFACX,OADW;AAEpB;;;;kCAES,G,EAAK;AACX,kFAAU,MAAM,MAAhB;AACH;;;;EARgB,O","file":"classes.js","sourcesContent":["class BaseLog {\r\n constructor() {\r\n this.logName = 'Log1';\r\n }\r\n\r\n log(msg) {\r\n console.log(this.logName + ': ' + msg);\r\n }\r\n}\r\n\r\nclass Logger extends BaseLog {\r\n\r\n constructor(logName) {\r\n super(logName);\r\n }\r\n\r\n writeLine(msg) {\r\n super.log(msg + '\\r\\n');\r\n }\r\n}\r\n"],"sourceRoot":"/source/"}
--------------------------------------------------------------------------------
/Mastering JavaScript/js/compiled/babel/loggerLoader.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | var logger = new Logger('MyLog');
4 | logger.writeLine('Logging via ES6 classes!');
5 | //# sourceMappingURL=loggerLoader.js.map
6 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/compiled/babel/loggerLoader.js.map:
--------------------------------------------------------------------------------
1 | {"version":3,"sources":["loggerLoader.js"],"names":[],"mappings":";;AAAA,IAAI,SAAS,IAAI,MAAJ,CAAW,OAAX,CAAb;AACA,OAAO,SAAP,CAAiB,0BAAjB","file":"loggerLoader.js","sourcesContent":["var logger = new Logger('MyLog');\r\nlogger.writeLine('Logging via ES6 classes!');"],"sourceRoot":"/source/"}
--------------------------------------------------------------------------------
/Mastering JavaScript/js/compiled/babel/parameters.js.map:
--------------------------------------------------------------------------------
1 | {"version":3,"sources":["parameters.js"],"names":[],"mappings":";;;;;;IAAM,G;;;;;;;sCAEY;AACV,mBAAO,IAAI,IAAJ,GAAW,WAAX,EAAP;AACH;;;;;;qCAG2F;AAAA,gBAAjF,IAAiF,yDAA1E,SAA0E;AAAA,gBAA/D,KAA+D,yDAAvD,UAAuD;AAAA,gBAA3C,IAA2C,yDAApC,KAAK,WAAL,EAAoC;;AACxF,oBAAQ,GAAR,CAAY,OAAO,GAAP,GAAa,KAAb,GAAqB,GAArB,GAA2B,IAAvC;;AADwF,8CAAb,WAAa;AAAb,2BAAa;AAAA;;AAExF,gBAAI,WAAJ,EAAiB;AACb,qBAAK,IAAI,IAAI,CAAb,EAAgB,IAAI,YAAY,MAAhC,EAAwC,GAAxC,EAA6C;AACzC,4BAAQ,GAAR,CAAY,OAAO,YAAY,CAAZ,CAAnB;AACH;AACJ;AACJ;;;;;;AAKL,IAAI,MAAM,IAAI,GAAJ,EAAV;;AAEA,IAAI,UAAJ,CAAe,QAAf,EAAyB,QAAzB;AACA,IAAI,UAAJ;;;AAGA,IAAI,UAAJ,CAAe,QAAf,EAAyB,QAAzB,EAAmC,IAAnC,EAAyC,SAAzC,EAAoD,KAApD,EAA2D,QAA3D","file":"parameters.js","sourcesContent":["class Car {\r\n\r\n currentYear() {\r\n return new Date().getFullYear();\r\n }\r\n \r\n //The year parameter is a \"default parameter\"\r\n setDetails(make = 'No Make', model = 'No Model', year = this.currentYear(), ...accessories) {\r\n console.log(make + ' ' + model + ' ' + year); \r\n if (accessories) {\r\n for (var i = 0; i < accessories.length; i++) {\r\n console.log('\\n' + accessories[i]);\r\n }\r\n }\r\n }\r\n\r\n}\r\n\r\n\r\nvar car = new Car();\r\n//Testing default parameters\r\ncar.setDetails('Toyota', 'Tundra');\r\ncar.setDetails();\r\n\r\n//Testing rest parameters\r\ncar.setDetails('Toyota', 'Tundra', 2015, 'sunroof', '4X4', '4-door');\r\n"],"sourceRoot":"/source/"}
--------------------------------------------------------------------------------
/Mastering JavaScript/js/compiled/babel/scopeAndLet.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | var age = 55;
4 |
5 | for (var _i = 0; _i < 5; _i++) {
6 | age += 5;
7 | }
8 |
9 | try {
10 | console.log(i);
11 | } catch (e) {
12 | console.log('i is out of scope due to using let!');
13 | }
14 | //# sourceMappingURL=scopeAndLet.js.map
15 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/compiled/babel/scopeAndLet.js.map:
--------------------------------------------------------------------------------
1 | {"version":3,"sources":["scopeAndLet.js"],"names":[],"mappings":";;AAAA,IAAI,MAAM,EAAV;;AAEA,KAAK,IAAI,KAAI,CAAb,EAAgB,KAAI,CAApB,EAAuB,IAAvB,EAA4B;AACxB,WAAO,CAAP;AACH;;AAED,IAAI;AACA,YAAQ,GAAR,CAAY,CAAZ;AACH,CAFD,CAEE,OAAO,CAAP,EAAU;AACR,YAAQ,GAAR,CAAY,qCAAZ;AACH","file":"scopeAndLet.js","sourcesContent":["var age = 55;\r\n\r\nfor (let i = 0; i < 5; i++) {\r\n age += 5;\r\n}\r\n\r\ntry {\r\n console.log(i);\r\n} catch (e) {\r\n console.log('i is out of scope due to using let!');\r\n}"],"sourceRoot":"/source/"}
--------------------------------------------------------------------------------
/Mastering JavaScript/js/compiled/babel/templateStrings.js.map:
--------------------------------------------------------------------------------
1 | {"version":3,"sources":["templateStrings.js"],"names":[],"mappings":";;;;;;;;;;IAAa,G,WAAA,G;AACT,iBAAY,IAAZ,EAAkB,KAAlB,EAAyB,MAAzB,EAAiC,KAAjC,EAAwC;AAAA;;AACpC,aAAK,KAAL,GAAa,IAAb;AACA,aAAK,MAAL,GAAc,KAAd;AACA,aAAK,OAAL,GAAe,MAAf;AACA,aAAK,MAAL,GAAc,KAAd;AACA,aAAK,QAAL,GAAgB,GAAhB;AACH;;;;gCAcO;;AAEJ,mBAAU,KAAK,IAAf,SAAuB,KAAK,KAA5B,kCACU,KAAK,MADf;AAEH;;;mCAEU;AACP,wCAA0B,KAAK,MAAL,GAAc,KAAK,QAApB,GACjB,KAAK,MADb;AAEH;;;4BArBU;AACP,mBAAO,KAAK,KAAZ;AACH;;;4BAEW;AACR,mBAAO,KAAK,MAAZ;AACH;;;4BAEY;AACT,mBAAO,KAAK,OAAZ;AACH","file":"templateStrings.js","sourcesContent":["export class Car {\r\n constructor(make, model, engine, price) {\r\n this._make = make;\r\n this._model = model;\r\n this._engine = engine;\r\n this._price = price;\r\n this._taxRate = .08;\r\n }\r\n\r\n get make() {\r\n return this._make;\r\n }\r\n\r\n get model() {\r\n return this._model;\r\n }\r\n\r\n get engine() {\r\n return this._engine;\r\n }\r\n \r\n start() {\r\n //Use a template string\r\n return `${this.make} ${this.model} with a \r\n ${this.engine} engine is started!`;\r\n }\r\n\r\n getTotal() {\r\n return `Total cost is: ${(this._price * this._taxRate) + \r\n this._price}`;\r\n }\r\n}\r\n\r\n"],"sourceRoot":"/source/"}
--------------------------------------------------------------------------------
/Mastering JavaScript/js/compiled/babel/weakmap-weakset.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | //Using WeakSet
4 | var weakset = new WeakSet();
5 | //No size, entries, or values
6 | //can't use forEach (not enumerable), can't mix types
7 | var person1 = { name: 'Fred' },
8 | person2 = { name: 'Michelle' };
9 |
10 | weakset.add(person1);
11 | weakset.add(person2);
12 |
13 | if (weakset.has(person1)) console.log('Found person!');
14 | weakset.delete(person2); //Delete single item
15 |
16 | //Using WeakMap
17 | var weakmap = new WeakMap();
18 | //No size, entries, or values
19 | //can't use forEach (not enumerable), key must be an object
20 | var person1 = { name: 'Fred' },
21 | person2 = { name: 'Michelle' },
22 | key1 = { key: '123' },
23 | key2 = { key: '321' };
24 |
25 | weakmap.set(key1, person1);
26 | weakmap.set(key2, person2);
27 |
28 | var person = weakmap.get(key2);
29 | console.log('Map has person key 321: ' + person.name);
30 |
31 | if (weakmap.has(key1)) console.log('Found person!');
32 | weakmap.delete(key2); //Delete single item
33 | //# sourceMappingURL=weakmap-weakset.js.map
34 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/compiled/babel/weakmap-weakset.js.map:
--------------------------------------------------------------------------------
1 | {"version":3,"sources":["weakmap-weakset.js"],"names":[],"mappings":";;;AACA,IAAI,UAAU,IAAI,OAAJ,EAAd;;;AAGA,IAAI,UAAU,EAAE,MAAM,MAAR,EAAd;IACI,UAAU,EAAE,MAAM,UAAR,EADd;;AAGA,QAAQ,GAAR,CAAY,OAAZ;AACA,QAAQ,GAAR,CAAY,OAAZ;;AAEA,IAAI,QAAQ,GAAR,CAAY,OAAZ,CAAJ,EAA0B,QAAQ,GAAR,CAAY,eAAZ;AAC1B,QAAQ,MAAR,CAAe,OAAf,E;;;AAIA,IAAI,UAAU,IAAI,OAAJ,EAAd;;;AAGA,IAAI,UAAU,EAAE,MAAM,MAAR,EAAd;IACI,UAAU,EAAE,MAAM,UAAR,EADd;IAEI,OAAO,EAAC,KAAK,KAAN,EAFX;IAGI,OAAO,EAAC,KAAK,KAAN,EAHX;;AAKA,QAAQ,GAAR,CAAY,IAAZ,EAAkB,OAAlB;AACA,QAAQ,GAAR,CAAY,IAAZ,EAAkB,OAAlB;;AAEA,IAAI,SAAS,QAAQ,GAAR,CAAY,IAAZ,CAAb;AACA,QAAQ,GAAR,CAAY,6BAA6B,OAAO,IAAhD;;AAEA,IAAI,QAAQ,GAAR,CAAY,IAAZ,CAAJ,EAAuB,QAAQ,GAAR,CAAY,eAAZ;AACvB,QAAQ,MAAR,CAAe,IAAf,E","file":"weakmap-weakset.js","sourcesContent":["//Using WeakSet\r\nvar weakset = new WeakSet();\r\n//No size, entries, or values\r\n//can't use forEach (not enumerable), can't mix types\r\nvar person1 = { name: 'Fred' },\r\n person2 = { name: 'Michelle' };\r\n\r\nweakset.add(person1);\r\nweakset.add(person2);\r\n\r\nif (weakset.has(person1)) console.log('Found person!');\r\nweakset.delete(person2); //Delete single item\r\n\r\n\r\n//Using WeakMap\r\nvar weakmap = new WeakMap();\r\n//No size, entries, or values\r\n//can't use forEach (not enumerable), key must be an object\r\nvar person1 = { name: 'Fred' },\r\n person2 = { name: 'Michelle' },\r\n key1 = {key: '123'},\r\n key2 = {key: '321'};\r\n\r\nweakmap.set(key1, person1);\r\nweakmap.set(key2, person2);\r\n\r\nvar person = weakmap.get(key2);\r\nconsole.log('Map has person key 321: ' + person.name);\r\n\r\nif (weakmap.has(key1)) console.log('Found person!');\r\nweakmap.delete(key2); //Delete single item\r\n\r\n"],"sourceRoot":"/source/"}
--------------------------------------------------------------------------------
/Mastering JavaScript/js/compiled/typescript/calculator.js:
--------------------------------------------------------------------------------
1 | window.onload = function () {
2 | var calc = new Calculator('X', 'Y', 'Output');
3 | };
4 | var Calculator = /** @class */ (function () {
5 | function Calculator(xId, yId, outputId) {
6 | this.x = document.getElementById(xId);
7 | this.y = document.getElementById(yId);
8 | this.output = document.getElementById(outputId);
9 | this.wireEvents();
10 | }
11 | Calculator.prototype.wireEvents = function () {
12 | var _this = this;
13 | document.getElementById('Add').addEventListener('click', function (event) {
14 | _this.output.innerHTML = _this.add(parseInt(_this.x.value), parseInt(_this.y.value)).toString();
15 | });
16 | document.getElementById('Subtract').addEventListener('click', function (event) {
17 | _this.output.innerHTML = _this.subtract(parseInt(_this.x.value), parseInt(_this.y.value)).toString();
18 | });
19 | };
20 | Calculator.prototype.add = function (x, y) {
21 | return x + y;
22 | };
23 | Calculator.prototype.subtract = function (x, y) {
24 | return x - y;
25 | };
26 | return Calculator;
27 | }());
28 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/compiled/typescript/calculatorJQuery.js:
--------------------------------------------------------------------------------
1 | ///
2 | $(document).ready(function () {
3 | var calc = new CalculatorjQuery('X', 'Y', 'Output');
4 | });
5 | var CalculatorjQuery = /** @class */ (function () {
6 | function CalculatorjQuery(xId, yId, outputId) {
7 | this.x = $('#' + xId);
8 | this.y = $('#' + yId);
9 | this.output = $('#' + outputId);
10 | this.wireEvents();
11 | }
12 | CalculatorjQuery.prototype.wireEvents = function () {
13 | var _this = this;
14 | $('#Add').click(function (event) {
15 | _this.output.html(_this.add(parseInt(_this.x.val()), parseInt(_this.y.val())).toString());
16 | });
17 | $('#Subtract').click(function (event) {
18 | _this.output.html(_this.subtract(parseInt(_this.x.val()), parseInt(_this.y.val())).toString());
19 | });
20 | };
21 | CalculatorjQuery.prototype.add = function (x, y) {
22 | return x + y;
23 | };
24 | CalculatorjQuery.prototype.subtract = function (x, y) {
25 | return x - y;
26 | };
27 | return CalculatorjQuery;
28 | }());
29 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/compiled/typescript/definingClasses.js:
--------------------------------------------------------------------------------
1 | var DefiningClasses;
2 | (function (DefiningClasses) {
3 | var Engine = /** @class */ (function () {
4 | function Engine(horsePower, engineType) {
5 | this.horsePower = horsePower;
6 | this.engineType = engineType;
7 | }
8 | return Engine;
9 | }());
10 | var Car = /** @class */ (function () {
11 | function Car(engine) {
12 | this.engine = engine;
13 | }
14 | Object.defineProperty(Car.prototype, "engine", {
15 | get: function () {
16 | return this._engine;
17 | },
18 | set: function (value) {
19 | if (value == undefined)
20 | throw 'Please supply an engine';
21 | this._engine = value;
22 | },
23 | enumerable: true,
24 | configurable: true
25 | });
26 | Car.prototype.start = function () {
27 | alert('Car engine started ' + this._engine.engineType);
28 | };
29 | return Car;
30 | }());
31 | window.onload = function () {
32 | var engine = new Engine(300, 'V8');
33 | var car = new Car(engine);
34 | alert(car.engine.engineType);
35 | car.start();
36 | };
37 | })(DefiningClasses || (DefiningClasses = {}));
38 |
--------------------------------------------------------------------------------
/Mastering JavaScript/js/libs/traceur-bootstrap.js:
--------------------------------------------------------------------------------
1 | // Copyright 2011 Traceur Authors.
2 | //
3 | // Licensed under the Apache License, Version 2.0 (the "License");
4 | // you may not use this file except in compliance with the License.
5 | // You may obtain a copy of the License at
6 | //
7 | // http://www.apache.org/licenses/LICENSE-2.0
8 | //
9 | // Unless required by applicable law or agreed to in writing, software
10 | // distributed under the License is distributed on an "AS IS" BASIS,
11 | // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12 | // See the License for the specific language governing permissions and
13 | // limitations under the License.
14 |
15 | new traceur.WebPageTranscoder(document.location.href).run();
--------------------------------------------------------------------------------
/Mastering JavaScript/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "jsdemos",
3 | "version": "1.0.0",
4 | "description": "Used for JavaScript Demos",
5 | "author": "Dan Wahlin",
6 | "scripts": {
7 | "start": "node server.js"
8 | },
9 | "dependencies": {
10 | "express": "^4.16.4"
11 | },
12 | "devDependencies": {
13 | "@babel/core": "^7.2.2",
14 | "@babel/preset-env": "^7.2.3",
15 | "gulp": "^4.0.0",
16 | "gulp-babel": "^8.0.0",
17 | "gulp-concat": "^2.6.1",
18 | "gulp-plumber": "^1.2.1",
19 | "gulp-sourcemaps": "^2.6.4",
20 | "gulp-typescript": "^5.0.0",
21 | "gulp-uglify": "^3.0.1",
22 | "typescript": "^3.3.3"
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/Mastering JavaScript/readme.txt:
--------------------------------------------------------------------------------
1 | Go to this directory in a command prompt.
2 |
3 | Run "npm install" to install the necessary Node.js modules.
4 |
5 | Run "npm start" to start the server.
6 |
7 | Navigate to http://localhost:8000 in the browser to view the demo page.
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/angularJS/basics.css:
--------------------------------------------------------------------------------
1 | .highlight { font-weight: bold;color: green;}
2 |
3 | [ng-cloak],[data-ng-cloak],.ng-cloak {display:none !important;}
4 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/angularJS/basics.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | AngularJS Hello World Example
5 |
6 |
7 |
8 | AngularJS Hello World Example
9 |
10 | Name:
11 |
12 | City:
13 |
14 | Name Output: {{vm.customer.name }}
15 |
16 | City Output: {{ vm.customer.city }}
17 |
18 |
19 |
20 |
21 |
22 |
23 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/angularJS/basics.js:
--------------------------------------------------------------------------------
1 | var app = angular.module('customersApp', []);
2 |
3 | app.controller('CustomersController', function () {
4 |
5 | this.customer = { name: 'John', city: 'Dallas' };
6 |
7 | });
8 |
9 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/angularJS/table.css:
--------------------------------------------------------------------------------
1 | [ng-cloak], [data-ng-cloak], .ng-cloak {
2 | display: none !important;
3 | }
4 |
5 | table {
6 | width: 300px;
7 | }
8 |
9 | .sale { font-weight: bold;color: green;}
10 | .nosale { color: black;}
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/angularJS/table.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Rendering a Table with AngularJS
5 |
6 |
7 |
8 | Rendering a Table with AngularJS
9 | Products
10 |
11 |
12 |
13 | {{ item.title }}
14 | {{ item.price }}
15 |
16 |
17 |
18 | Total:
19 |
{{ vm.total }}
20 |
21 |
22 |
23 |
24 |
25 |
26 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/angularJS/table.js:
--------------------------------------------------------------------------------
1 | var app = angular.module('productsApp', []);
2 |
3 | app.controller('ProductsController', function () {
4 |
5 | var vm = this;
6 |
7 | vm.total = 0;
8 | vm.items = [
9 | { title: 'Game', price: 59.99, sale: true },
10 | { title: 'Movie Ticket', price: 9.99, sale: false }
11 | ];
12 |
13 | function init() {
14 | var total = 0;
15 | for (var i = 0, len = vm.items.length; i < len; i++) {
16 | total += vm.items[i].price;
17 | }
18 | vm.total = total;
19 | }
20 |
21 | init();
22 |
23 | });
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/handlebars/basics.css:
--------------------------------------------------------------------------------
1 | .highlight { font-weight: bold;color: green;}
2 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/handlebars/basics.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Handlebars Hello World Example
5 |
6 |
7 |
8 | Handlebars Hello World Example
9 |
10 |
11 |
17 |
18 |
19 |
20 |
21 |
22 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/handlebars/basics.js:
--------------------------------------------------------------------------------
1 | Handlebars.registerHelper("highlightCity", function (city) {
2 | var highlightedCities = ['Dallas', 'Seattle','Orlando'];
3 | return (highlightedCities.indexOf(city) > -1) ? 'highlight' : '';
4 | });
5 |
6 | var data = { name: 'John', city: 'Dallas' };
7 |
8 | var renderer = function (data) {
9 | var source = document.getElementById('personTemplate').innerHTML;
10 | var template = Handlebars.compile(source);
11 | document.getElementById('container').innerHTML = template(data);
12 | }(data);
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/handlebars/table.css:
--------------------------------------------------------------------------------
1 | table {
2 | width: 300px;
3 | }
4 | .sale { font-weight: bold;color: green;}
5 | .nosale { color: black;}
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/handlebars/table.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Rendering a Table with Handlebars
5 |
6 |
7 |
8 | Rendering a Table with Handlebars
9 | Products
10 |
11 |
12 |
24 |
25 |
26 |
27 |
28 |
29 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/handlebars/table.js:
--------------------------------------------------------------------------------
1 | Handlebars.registerHelper("getSaleCSSClass", function (sale) {
2 | return (sale) ? 'sale' : 'nosale';
3 | });
4 |
5 | var ViewModel = function (items) {
6 |
7 | render = function () {
8 | var total = 0;
9 | for (var i = 0, len = items.length; i < len; i++) {
10 | total += items[i].price;
11 | }
12 |
13 | var data = { total: total, items: items };
14 |
15 | var source = document.getElementById('tableTemplate').innerHTML;
16 | var template = Handlebars.compile(source);
17 | document.getElementById('container').innerHTML = template(data);
18 |
19 | };
20 |
21 | return {
22 | render: render
23 | }
24 | };
25 |
26 | var items = [
27 | { title: 'Game', price: 59.99, sale: true },
28 | { title: 'Movie Ticket', price: 9.99, sale: false }
29 | ];
30 | var vm = new ViewModel(items);
31 | vm.render();
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/knockoutJS/basics.css:
--------------------------------------------------------------------------------
1 | .highlight { font-weight: bold;color: green;}
2 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/knockoutJS/basics.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Knockout Hello World Example
5 |
6 |
7 |
8 | Knockout Hello World Example
9 |
10 | Name:
11 |
12 | City:
13 |
14 | Name Output:
15 |
16 | City Output:
17 |
18 |
19 |
20 |
21 |
22 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/knockoutJS/basics.js:
--------------------------------------------------------------------------------
1 | var helloWorldViewModel = {
2 | name: ko.observable("Seth"),
3 | city: ko.observable("Chandler")
4 | };
5 | ko.applyBindings(helloWorldViewModel);
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/knockoutJS/table.css:
--------------------------------------------------------------------------------
1 | table {
2 | width: 300px;
3 | }
4 | .sale { font-weight: bold;color: green;}
5 | .nosale { color: black;}
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/knockoutJS/table.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Rendering a Table with KnockoutJS
5 |
6 |
7 |
8 | Rendering a Table with KnockoutJS
9 | Products
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 | Total:
21 |
22 |
23 |
24 |
25 |
26 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/knockoutJS/table.js:
--------------------------------------------------------------------------------
1 | var ProductsViewModel = function (items) {
2 | var vm = this;
3 | vm.items = ko.observableArray(items);
4 | vm.total = ko.observable();
5 |
6 | vm.getSaleClass = function (sale) {
7 | return (sale) ? 'sale' : 'nosale';
8 | }
9 |
10 | vm.init = function () {
11 | //Update total property
12 | var total = 0;
13 | for (var i = 0, len=vm.items().length; i < len; i++) {
14 | total += vm.items()[i].price;
15 | }
16 | vm.total(total);
17 | }
18 | };
19 |
20 | var items = [
21 | { title: 'Game', price: 59.99, sale: true },
22 | { title: 'Movie Ticket', price: 9.99, sale: false }
23 | ];
24 | var viewModel = new ProductsViewModel(items);
25 | viewModel.init();
26 | ko.applyBindings(viewModel);
27 |
28 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/manipulatingTheDOM.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Manipulating the DOM with JavaScript
5 |
8 |
9 |
10 | Manipulating the DOM with JavaScript
11 | Purchases
12 |
13 |
14 | Total:
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/dataBindingAndTemplates/manipulatingTheDOM.js:
--------------------------------------------------------------------------------
1 | var items = [
2 | { title: 'Game', price: 59.99 },
3 | { title: 'Movie Ticket', price: 9.99 }
4 | ];
5 | var total = 0, html = '';
6 | for (var i = 0, len=items.length; i < len; i++) {
7 | var item = items[i];
8 | html += '' + item.title + ' ' +
9 | '' + item.price + ' ';
10 | total += item.price;
11 | }
12 | html += '
';
13 |
14 | document.getElementById('purchases').innerHTML = html;
15 | document.getElementById('total').innerHTML = total;
16 |
17 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/Working with ES2015 Modules/.gitignore:
--------------------------------------------------------------------------------
1 | /node_modules
2 | /jspm_packages
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/Working with ES2015 Modules/config.js:
--------------------------------------------------------------------------------
1 | System.config({
2 | "baseURL": "/dist",
3 | "transpiler": "babel",
4 | "babelOptions": {
5 | "optional": [
6 | "runtime"
7 | ]
8 | },
9 | "paths": {
10 | "*": "*.js"
11 | },
12 | "defaultJSExtensions": true
13 | });
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/Working with ES2015 Modules/dist/auto.js:
--------------------------------------------------------------------------------
1 | "use strict";
2 |
3 | Object.defineProperty(exports, "__esModule", {
4 | value: true
5 | });
6 |
7 | var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
8 |
9 | function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
10 |
11 | var Auto = (function () {
12 | function Auto(data) {
13 | _classCallCheck(this, Auto);
14 |
15 | this.make = data.make;
16 | this.model = data.model;
17 | this.year = data.year;
18 | this.price = data.price;
19 | }
20 |
21 | _createClass(Auto, [{
22 | key: "getTotal",
23 | value: function getTotal(taxRate) {
24 | return this.price + this.price * taxRate;
25 | }
26 | }, {
27 | key: "getDetails",
28 | value: function getDetails() {
29 | return this.year + " " + this.make + " " + this.model;
30 | }
31 | }]);
32 |
33 | return Auto;
34 | })();
35 |
36 | exports.Auto = Auto;
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/Working with ES2015 Modules/dist/main.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | var _car = require('car');
4 |
5 | var _truck = require('truck');
6 |
7 | var car = new _car.Car({
8 | price: 30000, make: 'Chevy', model: 'Malibu',
9 | year: 2014, isElectric: false, isHatchback: false
10 | });
11 |
12 | var truck = new _truck.Truck({
13 | price: 40000, make: 'Ford', model: 'F150',
14 | year: 2014, is4by4: true
15 | });
16 |
17 | var output = document.getElementById('output');
18 | output.innerHTML += '\n\t ' + car.getDetails() + '\n Car total: ' + car.getTotal(.08) + '\n\t \n\t' + truck.getDetails() + '\n\t Truck total: ' + truck.getTotal(.08) + '\n\t';
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/Working with ES2015 Modules/gulpfile.js:
--------------------------------------------------------------------------------
1 | var babel = require('gulp-babel');
2 | var browserSync = require('browser-sync');
3 | var gulp = require('gulp');
4 | var es6Path = 'js/*.js';
5 | var compilePath = 'dist';
6 | var superstatic = require( 'superstatic' );
7 |
8 | gulp.task('babel', function () {
9 | gulp.src([es6Path])
10 | .pipe(babel())
11 | .pipe(gulp.dest(compilePath));
12 | });
13 |
14 | gulp.task('watch', function() {
15 | gulp.watch(es6Path, ['babel']);
16 | });
17 |
18 | gulp.task('serve', ['watch'], function() {
19 | process.stdout.write('Starting browserSync and superstatic...\n');
20 | browserSync({
21 | port: 3000,
22 | files: ['index.html', '**/*.js'],
23 | injectChanges: true,
24 | logFileChanges: false,
25 | logLevel: 'silent',
26 | logPrefix: 'es6-modules-starter',
27 | notify: true,
28 | reloadDelay: 0,
29 | server: {
30 | baseDir: '.',
31 | middleware: superstatic({ debug: false})
32 | }
33 | });
34 | });
35 |
36 | gulp.task('default', ['babel', 'watch']);
37 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/Working with ES2015 Modules/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | ES6 JavaScript with Modules Using System.js
5 |
6 |
7 | Automobiles
8 |
9 |
10 |
11 |
12 |
13 |
14 |
17 |
18 |
19 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/Working with ES2015 Modules/js/auto.js:
--------------------------------------------------------------------------------
1 | export class Auto {
2 | constructor(data) {
3 | this.make = data.make;
4 | this.model = data.model;
5 | this.year = data.year;
6 | this.price = data.price;
7 | }
8 |
9 | getTotal(taxRate) {
10 | return this.price + (this.price * taxRate);
11 | }
12 |
13 | getDetails() {
14 | return `${this.year} ${this.make} ${this.model}`;
15 | }
16 | }
17 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/Working with ES2015 Modules/js/car.js:
--------------------------------------------------------------------------------
1 | import {Auto} from 'auto';
2 |
3 | export class Car extends Auto {
4 | constructor(data) {
5 | super(data);
6 | this.isElectric = data.isElectric;
7 | this.isHatchback = data.isHatchback;
8 | }
9 |
10 | getDetails() {
11 | return `${super.getDetails()} Electric: ${this.isElectric} Hatchback: ${this.isHatchback}`;
12 | }
13 | }
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/Working with ES2015 Modules/js/main.js:
--------------------------------------------------------------------------------
1 | import {Car} from 'car';
2 | import {Truck} from 'truck';
3 |
4 | let car = new Car({
5 | price: 30000, make: 'Chevy', model: 'Malibu',
6 | year: 2014, isElectric: false, isHatchback: false
7 | });
8 |
9 | let truck = new Truck({
10 | price: 40000, make: 'Ford', model: 'F150',
11 | year: 2014, is4by4: true
12 | });
13 |
14 | var output = document.getElementById('output');
15 | output.innerHTML += `
16 | ${car.getDetails() }
17 | Car total: ${car.getTotal(.08) }
18 |
19 | ${truck.getDetails() }
20 | Truck total: ${truck.getTotal(.08) }
21 | `;
22 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/Working with ES2015 Modules/js/truck.js:
--------------------------------------------------------------------------------
1 | import {Auto} from 'auto';
2 |
3 | export class Truck extends Auto {
4 | constructor(data) {
5 | super(data);
6 | this.is4by4 = data.is4by4;
7 | }
8 |
9 | getDetails() {
10 | return `${super.getDetails()} 4x4: ${this.is4by4}`;
11 | }
12 | }
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/Working with ES2015 Modules/jsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "ES6"
4 | }
5 | }
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/Working with ES2015 Modules/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "ES6",
3 | "version": "1.0.0",
4 | "description": "ES6 SystemJS and Modules",
5 | "contributors": [
6 | {
7 | "name": "John Papa"
8 | },
9 | {
10 | "name": "Dan Wahlin"
11 | }
12 | ],
13 | "scripts": {
14 | "start": "gulp serve",
15 | "postinstall": ""
16 | },
17 | "dependencies": {
18 | "systemjs": "^0.18.4"
19 | },
20 | "devDependencies": {
21 | "browser-sync": "^2.8.2",
22 | "gulp": "^3.8.8",
23 | "gulp-babel": "^5.1.0",
24 | "superstatic": "^1.2.3"
25 | }
26 | }
27 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/arrowFunctions.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Arrow Functions
5 |
6 |
7 | Arrow Functions
8 | Press ctrl/cmd-shift-i and view the debugging console for output.
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/arrowFunctions.js:
--------------------------------------------------------------------------------
1 | var myLogger = msg => console.log(msg); //Creates an anonymous function
2 |
3 | myLogger('Testing out arrow functions!');
4 |
5 | //Working with "this" the "old" way
6 | function Car() {
7 | var self = this;
8 | this._seats = 4;
9 |
10 | this.timeout = function() {
11 | setTimeout(function() {
12 | console.log(self._seats++);
13 | }, 1000);
14 | }
15 | }
16 |
17 | //Working with this using arrow functions
18 | class CarWithArrow {
19 |
20 | constructor() {
21 | this._seats = 6;
22 | }
23 |
24 | timeout() {
25 | setTimeout(() => {
26 | console.log(this._seats++);
27 | }, 1000);
28 | }
29 | }
30 |
31 | var c = new Car();
32 | c.timeout();
33 | var cArrow = new CarWithArrow();
34 | cArrow.timeout();
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/classes.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Classes and Inheritance
5 |
6 |
7 | Classes and Inheritance
8 | Press ctrl/cmd-shift-i and view the debugging console for output.
9 |
10 |
11 |
15 |
16 |
17 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/classes.js:
--------------------------------------------------------------------------------
1 | class BaseLog {
2 | constructor() {
3 | this.logName = 'Log1';
4 | }
5 |
6 | log(msg) {
7 | console.log(this.logName + ': ' + msg);
8 | }
9 | }
10 |
11 | class Logger extends BaseLog {
12 |
13 | constructor(logName) {
14 | super(logName);
15 | }
16 |
17 | writeLine(msg) {
18 | super.log(msg + '\r\n');
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/destructuring.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Destructuring
5 |
6 |
7 | Destructuring
8 | Press ctrl/cmd-shift-i and view the debugging console for output.
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/destructuring.js:
--------------------------------------------------------------------------------
1 | //Old Way
2 | var values = [9.99, .50];
3 | var oldTotal = values[0],
4 | oldTax = values[1];
5 |
6 | //New Way (Destructuring)
7 | var [total, tax] = [9.99, .50];
8 | var {total2, tax2} = {total:9.99, tax:.50};
9 |
10 | console.log('Destructuring an array.');
11 | console.log('Total: ' + total + ' Tax: ' + tax);
12 |
13 | console.log('\nDestructuring an object literal.');
14 | console.log('Total2: ' + total2 + ' Tax2: ' + tax2);
15 |
16 | var colors = ['red', 'yellow', 'green'],
17 | redOld = colors[0],
18 | yellowOld = colors[1],
19 | greenOld = colors[2];
20 |
21 | var [red, yellow, green] = ['red', 'yellow', 'green'];
22 | console.log(`Destructuring colors: ${red} ${yellow} ${green}`);
23 |
24 | var [red2, , green2] = ['red', 'yellow', 'green'];
25 | console.log(`Destructuring with an ignore: ${red2} ${green2}`);
26 |
27 | console.log('\n');
28 | //Iteration and destructuring
29 | var pets = [
30 | {
31 | name: "Fido",
32 | type: 'Dog',
33 | treats: {
34 | treat1: "Chewie",
35 | treat2: "Chicken"
36 | },
37 | age: 10
38 | },
39 | {
40 | name: "Maestro",
41 | type: 'Dog',
42 | treats: {
43 | treat1: "Chew Stick",
44 | treat2: "Turkey Chew"
45 | },
46 | age: 5
47 | }
48 | ];
49 |
50 | //Here's the destructuring breakdown:
51 | //name maps to an n variable
52 | //type maps to a t variables
53 | //treats maps treat 1 to t1 and treat2 to t2
54 | for (var {name: n, type: t, treats: { treat1: t1, treat2: t2 } } of pets) {
55 | console.log(`${n} is a ${t} who likes ${t1} and ${t2} treats`);
56 | }
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/loggerLoader.js:
--------------------------------------------------------------------------------
1 | var logger = new Logger('MyLog');
2 | logger.writeLine('Logging via ES6 classes!');
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/maps.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Using Maps
5 |
6 |
7 | Using Maps
8 | Press ctrl/cmd-shift-i and view the debugging console for output.
9 |
10 | Maps provide a way to store a collection of unique key/value pairs.
11 |
12 |
13 |
14 |
15 |
16 |
17 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/modules-classes.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Modules and Classes
5 |
11 |
12 |
13 | Modules and Classes
14 | Car output
15 |
16 |
17 |
18 |
19 |
22 |
32 |
33 |
34 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/modules-classes.js:
--------------------------------------------------------------------------------
1 | class Auto {
2 | constructor(make, model, engine) {
3 | this._make = make;
4 | this._model = model;
5 | this._engine = engine;
6 | }
7 |
8 | get make() {
9 | return this._make;
10 | }
11 |
12 | set make(val) {
13 | this._make = val;
14 | }
15 |
16 | get model() {
17 | return this._model;
18 | }
19 |
20 | set model(val) {
21 | this._model = val;
22 | }
23 |
24 | get engine() {
25 | return this._engine;
26 | }
27 |
28 | set engine(val) {
29 | this._engine = val;
30 | }
31 | }
32 |
33 | export class Car extends Auto {
34 |
35 | constructor(make, model, engine, isElectric) {
36 | super(make, model, engine);
37 | this._isElectric = isElectric;
38 | }
39 |
40 | get isElectric() {
41 | return this._isElectric;
42 | }
43 |
44 | start() {
45 | //Use a template string
46 | if (this._isElectric) {
47 | return this.make + ' ' + this.model + ' with a ' + this.engine + ' (electric) engine is started!';
48 | }
49 | return this.make + ' ' + this.model + ' with a ' + this.engine + ' engine is started!';
50 | }
51 | }
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/parameters.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | ES6 Parameters
5 |
6 |
7 | ES6 Parameters
8 | Press ctrl/cmd-shift-i and view the debugging console for output.
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/parameters.js:
--------------------------------------------------------------------------------
1 | class Car {
2 |
3 | currentYear() {
4 | return new Date().getFullYear();
5 | }
6 |
7 | //The year parameter is a "default parameter"
8 | setDetails(make = 'No Make', model = 'No Model', year = this.currentYear(), ...accessories) {
9 | console.log(make + ' ' + model + ' ' + year);
10 | if (accessories) {
11 | for (var i = 0; i < accessories.length; i++) {
12 | console.log('\n' + accessories[i]);
13 | }
14 | }
15 | }
16 |
17 | }
18 |
19 |
20 | var car = new Car();
21 | //Testing default parameters
22 | car.setDetails('Toyota', 'Tundra');
23 | car.setDetails();
24 |
25 | //Testing rest parameters
26 | car.setDetails('Toyota', 'Tundra', 2015, 'sunroof', '4X4', '4-door');
27 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/scopeAndLet.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Scope and Let
5 |
6 |
7 | Scope and Let
8 | Press ctrl/cmd-shift-i and view the debugging console for output.
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/scopeAndLet.js:
--------------------------------------------------------------------------------
1 | var age = 55;
2 |
3 | for (let i = 0; i < 5; i++) {
4 | age += 5;
5 | }
6 |
7 | try {
8 | console.log(i);
9 | } catch (e) {
10 | console.log('i is out of scope due to using let!');
11 | }
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/sets.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Using Sets
5 |
6 |
7 | Using Sets
8 | Press ctrl/cmd-shift-i and view the debugging console for output.
9 |
10 | Sets provide a way to store a set of items that are all unique.
11 |
12 |
13 |
14 |
15 |
16 |
17 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/templateStrings.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Template Strings
5 |
11 |
12 |
13 | Template Strings
14 | Car output
15 |
16 |
17 |
18 |
19 |
22 |
32 |
33 |
34 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/templateStrings.js:
--------------------------------------------------------------------------------
1 | export class Car {
2 | constructor(make, model, engine, price) {
3 | this._make = make;
4 | this._model = model;
5 | this._engine = engine;
6 | this._price = price;
7 | this._taxRate = .08;
8 | }
9 |
10 | get make() {
11 | return this._make;
12 | }
13 |
14 | get model() {
15 | return this._model;
16 | }
17 |
18 | get engine() {
19 | return this._engine;
20 | }
21 |
22 | start() {
23 | //Use a template string
24 | return `${this.make} ${this.model} with a
25 | ${this.engine} engine is started!`;
26 | }
27 |
28 | getTotal() {
29 | return `Total cost is: ${(this._price * this._taxRate) +
30 | this._price}`;
31 | }
32 | }
33 |
34 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/traceurCompileOnTheFly.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Dynamic ES6 Code Compilation in the Browser with Traceur
5 |
6 |
7 | Dynamic ES6 Code Compilation in the Browser with Traceur
8 | Output from Logger Class:
9 |
10 |
11 |
12 |
13 |
16 |
41 |
42 |
43 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/weakmap-weakset.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | WeakMap and WeakSet
5 |
6 |
7 | WeakMap and WeakSet
8 | Press ctrl/cmd-shift-i and view the debugging console for output.
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/es2015/weakmap-weakset.js:
--------------------------------------------------------------------------------
1 | //Using WeakSet
2 | var weakset = new WeakSet();
3 | //No size, entries, or values
4 | //can't use forEach (not enumerable), can't mix types
5 | var person1 = { name: 'Fred' },
6 | person2 = { name: 'Michelle' };
7 |
8 | weakset.add(person1);
9 | weakset.add(person2);
10 |
11 | if (weakset.has(person1)) console.log('Found person!');
12 | weakset.delete(person2); //Delete single item
13 |
14 |
15 | //Using WeakMap
16 | var weakmap = new WeakMap();
17 | //No size, entries, or values
18 | //can't use forEach (not enumerable), key must be an object
19 | var person1 = { name: 'Fred' },
20 | person2 = { name: 'Michelle' },
21 | key1 = {key: '123'},
22 | key2 = {key: '321'};
23 |
24 | weakmap.set(key1, person1);
25 | weakmap.set(key2, person2);
26 |
27 | var person = weakmap.get(key2);
28 | console.log('Map has person key 321: ' + person.name);
29 |
30 | if (weakmap.has(key1)) console.log('Found person!');
31 | weakmap.delete(key2); //Delete single item
32 |
33 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/functionTechniques/arrayFunctions.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Using Array Functions
5 |
11 |
12 |
13 | Using Array Functions
14 | View the results in the debugging console (ctrl/cmd+shift+i)
15 |
16 | This example demonstrates how various array functions can be used.
17 |
18 | Array Functions Output:
19 |
20 |
21 |
22 |
23 |
24 |
25 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/functionTechniques/bind-calculator.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Using Bind
5 |
8 |
9 |
10 | Using Bind
11 | View the results in the debugging console (ctrl/cmd+shift+i)
12 |
13 | This example demonstrates how bind() can be used to set the
14 | context of "this" when a function is called.
15 |
16 | Value 1:
17 |
18 | Value 2:
19 |
20 | +
21 | -
22 | *
23 | /
24 |
25 |
26 |
27 |
28 |
29 |
30 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/functionTechniques/bind-calculator.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 | var Calculator = function () {
3 | this.value1 = 0;
4 | this.value2 = 0;
5 | this.output = '';
6 | };
7 |
8 | Calculator.prototype.init = function () {
9 | var buttons = document.getElementsByTagName('button');
10 | for (var i = 0, len = buttons.length; i < len; i++) {
11 | //Ensure that button represents Calculator
12 | buttons[i].addEventListener('click', this.checkOperator.bind(this));
13 | }
14 | this.value1 = document.getElementById('value1');
15 | this.value2 = document.getElementById('value2');
16 | this.output = document.getElementById('output');
17 | };
18 |
19 | Calculator.prototype.checkOperator = function (e) {
20 | //"this" will normally be the button that triggered the event
21 | //Because bind was used "this" represents the Calculator object though
22 | this.calculate(e.target.innerHTML);
23 | };
24 |
25 | Calculator.prototype.calculate = function (operator) {
26 | var val1 = parseInt(this.value1.value),
27 | val2 = parseInt(this.value2.value);
28 | switch (operator) {
29 | case '+':
30 | this.updateUI(val1 + val2);
31 | break;
32 | case '-':
33 | this.updateUI(val1 - val2);
34 | break;
35 | case '*':
36 | this.updateUI(val1 * val2);
37 | break;
38 | case '/':
39 | if (val2 == 0) return;
40 | this.updateUI(val1 / val2);
41 | break;
42 | }
43 | };
44 |
45 | Calculator.prototype.updateUI = function (total) {
46 | this.output.innerHTML = total;
47 | };
48 |
49 | var calculator = new Calculator();
50 | calculator.init();
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/functionTechniques/call-apply.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Using call() and apply()
5 |
11 |
12 |
13 | Using call() and apply()
14 | View the results in the debugging console (ctrl/cmd+shift+i)
15 |
16 | This example demonstrates how to get started using the call() and apply() methods to
17 | change the context of "this".
18 |
19 | TauntMachine Output:
20 |
21 |
22 |
23 |
24 |
25 |
26 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/functionTechniques/call-apply.js:
--------------------------------------------------------------------------------
1 | var giants = {
2 | name: 'New York Giants',
3 | play: function () {
4 | log('We are the ' + this.name);
5 | }
6 | }
7 |
8 | var packers = Object.create(giants);
9 | packers.name = 'Green Bay Packers';
10 |
11 | console.clear();
12 | console.log('Calling giants.play');
13 | giants.play() //"this" is giants
14 |
15 | console.log('Calling packers.play');
16 | packers.play() //"this" is packers
17 |
18 |
19 | //Using call(), apply(), and bind()
20 |
21 | var cardinals = {
22 | name: 'Arizona Cardinals',
23 | message: 'Smash!'
24 | };
25 |
26 | var seahawks = {
27 | name: 'Seattle Seahawks',
28 | message: 'Crush!'
29 | }
30 |
31 | var TauntMachine = function () {
32 | this.taunt = function (foe) {
33 | var msg = 'We will ' + this.message + ' the ' + foe.name +
34 | ', we are the ' + this.name;
35 | log(msg);
36 | };
37 | };
38 |
39 | var tauntMachine = new TauntMachine();
40 | console.log('What is wrong here?');
41 | tauntMachine.taunt(seahawks, cardinals.message);
42 |
43 | console.log('\nUsing call() to set "cardinals" as "this" and pass '+
44 | 'the seahawks object to taunt()');
45 |
46 | tauntMachine.taunt.call(cardinals, seahawks);
47 |
48 | console.log('\nUsing apply() to set "seahawks" as "this" and pass ' +
49 | 'the cardinals object to taunt()');
50 | tauntMachine.taunt.apply(seahawks, [cardinals]);
51 |
52 | console.log('\nBinding cardinals to tauntMachine.taunt using bind()');
53 |
54 | var cardinalsTaunt = tauntMachine.taunt.bind(cardinals);
55 | cardinalsTaunt(seahawks);
56 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/functionTechniques/call-tableHelper.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Using call()
5 |
6 |
7 |
8 | Using call()
9 | View the results in the debugging console (ctrl/cmd+shift+i)
10 |
11 | This example demonstrates how the call() function can be used.
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/functionTechniques/capturingThis-tableHelper.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Using call()
5 |
6 |
7 |
8 | Using call()
9 | View the results in the debugging console (ctrl/cmd+shift+i)
10 |
11 | This example demonstrates how to capture "this" to use in functions.
12 |
13 |
14 |
15 |
16 |
30 |
31 |
32 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/functionTechniques/customers.txt:
--------------------------------------------------------------------------------
1 | [
2 | { "firstName": "Jane", "lastName": "Doe", "city": "Phoenix" },
3 | { "firstName": "John", "lastName": "Doe", "city": "Phoenix" },
4 | { "firstName": "Michelle", "lastName": "Thompson", "city": "Seattle" },
5 | { "firstName": "Jose", "lastName": "Rodriguez", "city": "California" },
6 | { "firstName": "Tina", "lastName": "Smith", "city": "New York City" }
7 | ]
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/functionTechniques/iife.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Immediately Invoked Function Expression (IIFE)
5 |
6 |
7 | Immediately Invoked Function Expression (IIFE)
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 | This example demonstrates how to use the Immediately Invoked Function Expression (IIFE) technique.
11 |
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/functionTechniques/iife.js:
--------------------------------------------------------------------------------
1 | var customersService = function () {
2 |
3 | this.showMessage = function () {
4 | alert('Hello from an IIFE');
5 | };
6 |
7 | return this;
8 |
9 | }();
10 |
11 | customersService.showMessage();
12 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/functionTechniques/promises-callbacks.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Promises vs. Callbacks
5 |
6 |
7 |
8 | Promises vs. Callbacks
9 | View the results in the debugging console (ctrl/cmd+shift+i)
10 |
11 | This example demonstrates how callbacks and promises can be used to handle asynchronous operations.
12 |
13 | Getting Data via a Callback
14 |
15 |
16 | Getting Data via a Promise
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/functionTechniques/promises-callbacks.js:
--------------------------------------------------------------------------------
1 | var customersService = function ($) {
2 |
3 | //Return a promise
4 | this.getCustomersWithPromise = function () {
5 | return $.getJSON('customers.txt');
6 | };
7 |
8 | //Handle the callback
9 | this.getCustomersWithCallback = function (callback) {
10 | $.getJSON('customers.txt').then(function (data) {
11 | callback(data);
12 | });
13 | };
14 |
15 | return this;
16 |
17 | }(jQuery); //IIFE
18 |
19 | //Get data via a callback
20 | customersService.getCustomersWithCallback(function (data) {
21 | //Promise resolved (no easy way to deal with an error though)
22 | var table = new TableHelper({
23 | data: data,
24 | containerId: 'tableContainerCallback'
25 | });
26 | table.render();
27 | });
28 |
29 | //Get data via a promise
30 | customersService.getCustomersWithPromise()
31 | .then(function (data) {
32 | //Promise resolved
33 | var table = new TableHelper({
34 | data: data,
35 | containerId: 'tableContainerPromise'
36 | });
37 | table.render();
38 | }, function (xhr, status, err) { //Handle error easily
39 | alert(err.message);
40 | });
41 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/functionTechniques/promisesAndQ.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Promises vs. Callbacks
5 |
6 |
7 |
8 | Promises vs. Callbacks
9 | View the results in the debugging console (ctrl/cmd+shift+i)
10 |
11 | This example demonstrates how promises can be created and resolved using the Q library.
12 |
13 | Getting Data via a Q Promise
14 | Loading Data...
15 |
16 |
17 |
18 |
19 |
34 |
35 |
36 |
37 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/functionTechniques/promisesAndQ.js:
--------------------------------------------------------------------------------
1 | var customersService = function () {
2 |
3 | var data = [
4 | { "firstName": "Jane", "lastName": "Doe", "city": "Phoenix" },
5 | { "firstName": "John", "lastName": "Doe", "city": "Phoenix" },
6 | { "firstName": "Michelle", "lastName": "Thompson", "city": "Seattle" },
7 | { "firstName": "Jose", "lastName": "Rodriguez", "city": "California" },
8 | { "firstName": "Tina", "lastName": "Smith", "city": "New York City" }
9 | ];
10 |
11 | //Create a deferred object and return a promise. Once data is available resolve the promise
12 | this.getCustomers = function () {
13 |
14 | var deferred = Q.defer(); //Create deferred object
15 |
16 | //Simulate delay
17 | window.setTimeout(function () {
18 | deferred.resolve(data); //Resolve the promise
19 | }, 2000);
20 |
21 | return deferred.promise; //Return the promise
22 | };
23 |
24 | return this;
25 |
26 | }(); //IIFE
27 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/functionTechniques/tableStyles.css:
--------------------------------------------------------------------------------
1 | table { width: 400px;}
2 | th { text-align:left;}
3 | tbody > tr:nth-child(odd) { background: #efefef; }
4 | .rowCount { margin-top: 10px; }
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsCanvasDemos/Images/drawImageAPI.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DanWahlin/MasteringJavaScriptCourseCode/f1943ad51260d83f8cec70367fd321bf277fdc52/Mastering JavaScript/samples/jsCanvasDemos/Images/drawImageAPI.png
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsCanvasDemos/Images/super-mario-bros-3.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DanWahlin/MasteringJavaScriptCourseCode/f1943ad51260d83f8cec70367fd321bf277fdc52/Mastering JavaScript/samples/jsCanvasDemos/Images/super-mario-bros-3.png
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsCanvasDemos/web.config:
--------------------------------------------------------------------------------
1 |
2 |
3 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsDOM/domManipulation.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | DOM Manipulation
5 |
6 |
7 | DOM Manipulation
8 | Click Me
9 |
10 |
11 |
12 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsDOM/domManipulation.js:
--------------------------------------------------------------------------------
1 | var container = document.getElementById('container');
2 | container.addEventListener('click', function () {
3 | this.innerHTML = 'Clicked Me!!!';
4 | });
5 |
6 |
7 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsDOM/events.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Handling Events
5 |
6 |
7 | Handling Events
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsDOM/events.js:
--------------------------------------------------------------------------------
1 | function addNumbers() {
2 | var x = parseInt(document.getElementById("x").value);
3 | var y = parseInt(document.getElementById("y").value);
4 | alert(x + y);
5 | }
6 |
7 | var submit2 = document.getElementById('submit2');
8 | submit2.addEventListener('click', addNumbers);
9 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsDOM/manipulatingCSS.css:
--------------------------------------------------------------------------------
1 | .block {
2 | background-color: yellow;
3 | }
4 |
5 | .hover {
6 | cursor: pointer;
7 | }
8 |
9 |
10 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsDOM/manipulatingCSS.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Manipulating CSS
5 |
6 |
7 |
8 | Manipulating CSS
9 | Click Me to Change CSS Styles
10 | Click Me to Change CSS Class
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsDOM/manipulatingCSS.js:
--------------------------------------------------------------------------------
1 | var container = document.getElementById('container'),
2 | container2 = document.getElementById('container2');
3 |
4 | container.addEventListener('click', function () {
5 | this.style.backgroundColor = 'navy';
6 | this.style.color = 'white';
7 | });
8 |
9 | container2.addEventListener('click', function (e) {
10 | if (this.className.indexOf('block') > -1) {
11 | this.className = this.className.replace(/(?:^|\s)block(?!\S)/g, '');
12 | this.innerHTML = "Click Me to Change CSS Class";
13 | }
14 | else {
15 | //Preserve any existing classes
16 | this.className += ' block';
17 | this.innerHTML = "Click Me Again to Change Back!";
18 | }
19 | });
20 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsGeolocation/geolocationDemo.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Geolocation Demo
5 |
6 |
7 | Longitude:
8 |
9 | Latitude:
10 |
11 | Altitude:
12 |
13 | Speed
14 |
15 | Accuracy (in meters):
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsGeolocation/geolocationDemo.js:
--------------------------------------------------------------------------------
1 | function geolocate() {
2 | if (navigator.geolocation) {
3 | navigator.geolocation.getCurrentPosition(getCurrentPositionCallback, errorCallback,
4 | {maximumAge:60000});
5 | }
6 | else {
7 | alert('Your browser doesn\'t support geolocation');
8 | }
9 | }
10 |
11 | function errorCallback(error) {
12 | switch (error.code) {
13 | case error.PERMISSION_DENIED: alert("User did not share geolocation info");
14 | break;
15 |
16 | case error.POSITION_UNAVAILABLE: alert("Could not detect current position");
17 | break;
18 |
19 | case error.TIMEOUT: alert("Timed out");
20 | break;
21 |
22 | default: alert(error.message);
23 | break;
24 | }
25 | }
26 |
27 | function getCurrentPositionCallback(position) {
28 | var coords = position.coords;
29 | updatePosition('long', coords.longitude);
30 | updatePosition('lat', coords.latitude);
31 | updatePosition('altitude', coords.altitude);
32 | updatePosition('speed', coords.speed);
33 | updatePosition('accuracy', coords.accuracy);
34 | }
35 |
36 | function updatePosition(id, val) {
37 | document.getElementById(id).innerHTML = val;
38 | }
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsGeolocation/geolocationWithMap.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Geolocation Demo
5 |
6 |
7 | Longitude:
8 |
9 | Latitude:
10 |
11 | Altitude:
12 |
13 | Speed
14 |
15 | Accuracy (in meters):
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsGeolocation/simpleGeolocation.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Geolocation Demo
6 |
7 |
8 | Longitude:
9 |
10 | Latitude:
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsGeolocation/simpleGeolocation.js:
--------------------------------------------------------------------------------
1 | function geolocate() {
2 | if (navigator.geolocation) {
3 | navigator.geolocation.getCurrentPosition(getCurrentPositionCallback);
4 | }
5 | else {
6 | alert('Your browser doesn\'t support geolocation');
7 | }
8 | }
9 |
10 | function getCurrentPositionCallback(position) {
11 | document.getElementById('long').innerHTML = position.coords.longitude;
12 | document.getElementById('lat').innerHTML = position.coords.latitude;
13 | }
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsLocalStorage/Images/chalkboard.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DanWahlin/MasteringJavaScriptCourseCode/f1943ad51260d83f8cec70367fd321bf277fdc52/Mastering JavaScript/samples/jsLocalStorage/Images/chalkboard.jpg
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/constructors.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | JavaScript Constructors
5 |
6 |
7 | JavaScript Contructors
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 | This example demonstrates how functions can be used
11 | as "constructors" by using the "new" keyword.
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/constructors.js:
--------------------------------------------------------------------------------
1 | //Constructor
2 | function Customer(firstName, lastName, city) {
3 | this.firstName = firstName;
4 | this.lastName = lastName;
5 | this.city = city;
6 | }
7 |
8 | //Using the constructor to create an object instance
9 | var john = new Customer('John', 'Doe', 'Seattle');
10 |
11 | console.log('Invoked Customer constructor and passed (\'John\', \'Doe\', \'Seattle\')');
12 | console.log('john is instanceof Customer: ' + (john instanceof Customer)); //true
13 | console.log(john);
14 |
15 | var michelle = new Customer('Michelle', 'Seattle');
16 |
17 | console.log('Invoked Customer constructor and passed ' +
18 | '(\'michelle\',\'Seattle\') - anything wrong?');
19 | console.log(michelle);
20 |
21 | //Constructor (passing object literal)
22 | function Customer2(info) {
23 | this.firstName = info.firstName;
24 | this.lastName = info.lastName;
25 | this.city = info.city;
26 | }
27 |
28 | //Using the constructor to create an object instance
29 | var tina = new Customer2({ firstName: 'Tina', lastName: 'Doe', city: 'Seattle' });
30 |
31 | console.log('\nInvoked Customer2 constructor and passed ' +
32 | '({firstName:\'Tina\', lastName:\'Doe\', city:\'Seattle\'})');
33 | console.log(tina);
34 |
35 | //Skipping some values
36 | var steve = new Customer2({ firstName: 'Steve', city: 'Seattle' });
37 | console.log('\nInvoked Customer2 constructor and passed ' +
38 | '{ firstName: \'Steve\', city: \'Seattle\' }');
39 | console.log(steve);
40 |
41 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/constructorsAndInstanceOf.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Constructors with instanceof
5 |
6 |
7 | Constructors with instanceof
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 | This example demonstrates how constructors that are called as
11 | regular functions can pollute the global scope (add global
12 | variables on to the window object) and how to fix that with an
13 | instanceof check.
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/constructorsAndInstanceOf.js:
--------------------------------------------------------------------------------
1 | //Normal Constructor
2 | function Customer(name) {
3 | this.name = name;
4 | }
5 |
6 | //Using the constructor to create an object instance
7 | Customer('John');
8 |
9 | console.log('Calling Customer as function so "this" will be window.');
10 | console.log('window.name: ' + window.name);
11 |
12 | //Constructor that requires "new"
13 | function Person(name) {
14 | //Check if "this" is an InstanceOfCustomer object
15 | if (!(this instanceof Person)) {
16 | return new Person(name);
17 | }
18 | //"this" will be a Person now
19 | this.fullname = name;
20 | }
21 |
22 | Person('John');
23 |
24 | console.log('\n');
25 | console.log('Calling Person that has an instanceof check so "this" will be Person object');
26 | console.log('window.fullname: ' + window.fullname);
27 |
28 |
29 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/factories.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | JavaScript Factories
5 |
6 |
7 | JavaScript Factories
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 | This example demonstrates how to create a factory that can be
11 | used to create other objects. The target object can't be instantiated
12 | directly and the developer must go through the factory method.
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/factories.js:
--------------------------------------------------------------------------------
1 | //Note that caller won't be acessible when using 'use strict'
2 | var person = function () {
3 | if (person.caller != personFactory.create) {
4 | throw new Error('There is no public constructor for person.');
5 | }
6 | };
7 |
8 | person.base = {
9 | firstName: '',
10 | lastName: '',
11 | type: 'Customer',
12 | getFullName: function () {
13 | return this.firstName + ' ' + this.lastName;
14 | }
15 | };
16 |
17 | var personFactory = {
18 | create: function (type, firstName, lastName) {
19 | var per = Object.create(person.base);
20 | per.firstName = firstName;
21 | per.lastName = lastName;
22 | if (type === 'Manager') {
23 | var mgr = Object.create(per);
24 | mgr.type = 'Manager';
25 | mgr.employees = 50;
26 | return mgr;
27 | }
28 | return per;
29 | }
30 | };
31 |
32 | //Use the personFactory to create an instance
33 | var p = personFactory.create('Customer', 'John', 'Doe');
34 | console.log('Person type: ' + p.type);
35 | console.log('Person name: ' + p.getFullName());
36 |
37 | //This will fail – have to go through factory
38 | try {
39 | var p2 = new person();
40 | }
41 | catch (e) {
42 | console.log('Unable to create an instance of person using "new". p2 = ' + p2);
43 | console.log(e.message);
44 | }
45 |
46 |
47 |
48 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/functionsAreObjects.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Functions are Objects
5 |
6 |
7 | Functions are Objects
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 | This example demonstrates how functions can be used as
11 | "constructors" via the "new" keyword.
12 |
13 |
14 |
15 |
16 |
17 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/functionsAreObjects.js:
--------------------------------------------------------------------------------
1 | //Functions as objects
2 | function Person(firstName, lastName) {
3 | this.firstName = firstName;
4 | this.lastName = lastName;
5 | }
6 |
7 | var Customer = function (firstName, lastName) {
8 | this.firstName = firstName;
9 | this.lastName = lastName;
10 | };
11 |
12 | var client = {
13 | firstName: 'John',
14 | lastName: 'Doe',
15 | concat: function () {
16 | return this.firstName + ' ' + this.lastName;
17 | }
18 | };
19 |
20 | console.log('Person is a ' + typeof Person);
21 | console.log('Customer is a ' + typeof Customer);
22 | console.log('client.concat is a ' + typeof client.concat);
23 |
24 | var person = new Person('Tina', 'Smith');
25 | var customer = new Customer('John', 'Doe');
26 |
27 | console.log('New person is a ' + typeof person);
28 | console.log('New customer is a ' + typeof customer);
29 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/hoisting.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | JavaScript Hoisting
5 |
6 |
7 | JavaScript Hoisting
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 | This example demonstrates how functions can be called before they are defined (a process called "hoisting").
11 | It's recommended that you define functions before they are used even though hoisting fixes things.
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/hoisting.js:
--------------------------------------------------------------------------------
1 | var name = getName('Jesse', 'James');
2 | console.log('JavaScript hoisting in action: ' + name);
3 |
4 | //Function will be moved to the top automatically
5 | function getName(firstName, lastName) {
6 | return firstName + ' ' + lastName;
7 | }
8 |
9 |
10 |
11 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/inheritance-classical-functionBase.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Classical Inheritance: Function Base
5 |
6 |
7 | Classical Inheritance: Function Base
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 | This example demonstrates the typical way to implement classical inheritance with a
11 | function as the base object.
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/inheritance-classical-functionBase.js:
--------------------------------------------------------------------------------
1 | function Person() {
2 | this.name = 'Person Name';
3 | }
4 |
5 | Person.prototype.addOrder = function (order) {
6 | console.log('Added order: ' + order);
7 | };
8 |
9 | function Customer(name) {
10 | this.name = name;
11 | }
12 |
13 | Customer.prototype = Object.create(Person.prototype);
14 | Customer.prototype.constructor = Customer;
15 |
16 | console.log('Creating Customer object which "derives" from Person');
17 | var cust = new Customer('Customer Name');
18 |
19 | cust.addOrder('Order 1');
20 | console.log('Customer name is: ' + cust.name);
21 |
22 |
23 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/inheritance-overriding.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Overriding Functions
5 |
6 |
7 | Overriding Functions
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 | This example demonstrates how functions can be overridden using prototypal inheritance techniques.
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/inheritance-overriding.js:
--------------------------------------------------------------------------------
1 | function Person() {
2 | this.name = 'Person Name';
3 | }
4 |
5 | Person.prototype.addOrder = function (order) {
6 | console.log('Added order: ' + order + ' for ' + this.name);
7 | };
8 |
9 | function Customer(name) {
10 | this.name = name;
11 | }
12 |
13 | Customer.prototype = Object.create(Person.prototype);
14 | Customer.prototype.constructor = Customer; //Optional here
15 | //Override addOrder
16 | Customer.prototype.addOrder = function (order) {
17 | //What's wrong with this (hint: look at the name that is written out...'undefined')
18 | //We'll learn how to fix this in a later chapter when we discuss call()
19 | Person.prototype.addOrder('Special Order ' + order);
20 | }
21 |
22 | console.log('Creating Customer object which "derives" from Person');
23 | var cust = new Customer('Customer Name');
24 | cust.addOrder('Order 1');
25 | console.log('Customer name is: ' + cust.name);
26 |
27 |
28 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/inheritance-prototypal-objectBase.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Prototypal Inheritance: Object Base
5 |
6 |
7 | Prototypal Inheritance: Object Base
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 | This example demonstrates the typical way to implement prototypal inheritance with an
11 | object literal as the base object.
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/inheritance-prototypal-objectBase.js:
--------------------------------------------------------------------------------
1 | var person = {
2 | name: 'Person Name',
3 | addOrder: function (order) {
4 | console.log('Added order: ' + order);
5 | }
6 | };
7 |
8 | function Customer(name) {
9 | this.name = name;
10 | }
11 |
12 | Customer.prototype = Object.create(person);
13 |
14 | console.log('Creating Customer object which "derives" from person object literal');
15 | var cust = new Customer('Customer Name');
16 |
17 | cust.addOrder('Order 1');
18 | console.log('Customer name is: ' + cust.name);
19 |
20 |
21 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/inheritance-prototypesAndProperties.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Properties on Prototypes
5 |
6 |
7 | Properties on Prototypes
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 | This example demonstrates the effect of putting a property in a prototype. A Person prototype
11 | defines an orderCount property that is updated each time an addOrder() function is called:
12 |
13 |
14 | Person.prototype.addOrder = function (order) {
15 | console.log('Added order: ' + order);
16 | Person.prototype.orderCount++;
17 | };
18 | Person.prototype.orderCount = 0;
19 |
20 |
21 | This can be useful when you want property data to be shared across a hierarchy but
22 | it's important to understand how prototypes work especially if properties are ever added
23 | onto a prototype. A child object that "inherits" from Person will also pick up any changes to the
24 | orderCount property unless the child defines it's own property. This can lead to unwanted side-effects.
25 |
26 |
27 |
28 |
29 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/inheritance-prototypesAndProperties.js:
--------------------------------------------------------------------------------
1 | function Person() {
2 | this.name = 'Person Name';
3 | }
4 |
5 | Person.prototype.addOrder = function (order) {
6 | console.log('Added order: ' + order);
7 | Person.prototype.orderCount++;
8 | };
9 |
10 | Person.prototype.orderCount = 0;
11 |
12 | function Customer(name) {
13 | this.name = name;
14 | }
15 | Customer.prototype = Object.create(Person.prototype);
16 |
17 | function PremiumCustomer(name) { }
18 | PremiumCustomer.prototype = Object.create(Customer.prototype);
19 |
20 | var cust = new Customer('Customer Name');
21 | cust.addOrder('Order 1');
22 | cust.addOrder('Order 2');
23 | cust.addOrder('Order 3');
24 | console.log('Customer order count is: ' + cust.orderCount);
25 |
26 | var premium = new PremiumCustomer('Premium Name');
27 | console.log('No premium orders were placed but the order count has changed:');
28 | console.log('Premium order count is: ' + premium.orderCount);
29 |
30 |
31 |
32 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/properties.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | JavaScript Properties
5 |
6 |
7 | JavaScript Properties
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 | This example shows different techniques that can be used to
11 | create properties.
12 |
13 | Properties can be defined in multiple ways:
14 |
15 |
16 | var person = {
17 | firstName: 'John',
18 | lastName: 'Doe'
19 | }
20 | person.age = 24;
21 | person['street'] = '123 Main St.';
22 | Object.defineProperty(Object.prototype,
23 | 'loginAttempts',
24 | { enumerable: false, value: 0});
25 |
26 |
27 | By using defineProperty() you have more control over how
28 | properties can be used. The following example shows how
29 | to disable writes:
30 |
31 | Object.defineProperty(obj, 'myProp', {
32 | value: 15,
33 | writable: false
34 | });
35 |
36 |
37 |
38 |
39 |
40 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/staticVariables.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Static Variables
5 |
6 |
7 | Static Variables
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 | Although JavaScript doesn't inherently support the concept of "static" members this demo
11 | will show how you can simulate a static.
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsObjects/staticVariables.js:
--------------------------------------------------------------------------------
1 | function Person() { }
2 | Person.age = 50;
3 |
4 | console.log('Person age is a static value: ' + Person.age);
5 |
6 | var john = new Person();
7 | console.log('Trying to call static age variable ' +
8 | 'through an instance. Value is: ' + john.age);
9 |
10 | //Another technique that uses closures (covered later in the course)
11 | var staticId = (function () {
12 | var id = 0; // This is the private persistent value
13 | // The outer function returns a nested function that has access
14 | // to the persistent value. It is this nested function we're storing
15 | // in the variable id above.
16 | return function () { return id++; }; // Return and increment
17 | })(); // Invoke the outer function after defining it - returns the nested function
18 |
19 | staticId(); // 0
20 | staticId(); // 1
21 | staticId(); // 2
22 |
23 |
24 |
25 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsPatterns/closure.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Using Functions
5 |
6 |
7 |
8 |
9 |
A simple demo of using a closure
10 | Note that the date variable milliseconds shown
11 | is the same across calls to the myClosure() function in the code.
12 | This is due to a "closure" being created that keeps the variable alive
13 | across function calls.
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsPatterns/closure.js:
--------------------------------------------------------------------------------
1 | //standard function - not a closure
2 | function myNonClosure() {
3 | //variable will not be stored in a closure between calls
4 | //to the myNonClosure function
5 | var date = new Date();
6 | return date.getMilliseconds();
7 | }
8 |
9 | //closure example
10 | function myClosure() {
11 | //date will be stored in the closure
12 | //due to the function referencing it
13 | var date = new Date();
14 |
15 | return function () {
16 | var otherDate = new Date();
17 | return "Closure variable value for milliseconds: " +
18 | date.getMilliseconds() +
19 | " Non closure variable value for milliseconds: " +
20 | otherDate.getMilliseconds() +
21 | " ";
22 | };
23 | }
24 |
25 | var myClosure2 = function () {
26 | var date = new Date(),
27 | myNestedFunc = function () {
28 | return "Closure for myNestedFunc: " + date.getMilliseconds();
29 | };
30 | return {
31 | myNestedFunc: myNestedFunc
32 | };
33 | }();
34 |
35 | //Using a closure
36 | var output = document.getElementById('Output'),
37 | closure = myClosure();
38 | output.innerHTML = closure();
39 | output.innerHTML += ' ' + myClosure2.myNestedFunc();
40 | setTimeout(function () {
41 | output.innerHTML += ' ' + closure();
42 | output.innerHTML += ' ' + myClosure2.myNestedFunc();
43 | }, 1500);
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsPrimer/conditionals.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Conditionals
5 |
6 |
7 | Conditionals
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 |
11 |
12 |
13 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsPrimer/conditionals.js:
--------------------------------------------------------------------------------
1 | //== vs. ===
2 | var x = 1;
3 | var y = '1';
4 |
5 | console.log('x == y: ' + (x == y)); //true
6 | console.log('x === y: ' + (x === y)); //false
7 |
8 | var age = 50;
9 | console.log('age = 50');
10 |
11 | //Check if age is "truth-y"
12 | if (age) {
13 | console.log('age is truth-y');
14 | }
15 |
16 | var age = 50;
17 |
18 | if (age > 10 && age <= 50) {
19 | console.log('age is greater than 10 and less than or equal to 50');
20 | }
21 | else if (age > 50) {
22 | console.log('age is greater than 50');
23 | }
24 | else {
25 | console.log('age is less than 10');
26 | }
27 |
28 | //shortcut conditional operator
29 | var output = (age == 50) ? 'age is 50' : 'age is not 50';
30 | console.log('Shortcut conditional says: ' + output);
31 |
32 | var name = 'Fred';
33 | console.log('name = "Fred"');
34 |
35 | switch (name) {
36 | case 'Tim':
37 | console.log('case name = Tim hit');
38 | break;
39 | case 'Tina':
40 | console.log('case name = Tina hit');
41 | break;
42 | case 'Fred':
43 | console.log('case name = Fred hit');
44 | break;
45 | default:
46 | console.log('name is ' + name);
47 | break;
48 | }
49 |
50 |
51 |
52 |
53 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsPrimer/functions.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Using Functions
5 |
6 |
7 | Using Functions
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 |
11 |
12 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsPrimer/functions.js:
--------------------------------------------------------------------------------
1 | function add(x, y) {
2 | console.log(x + ' + ' + y + ' = ' + (x + y));
3 | }
4 |
5 | function subtract(x, y) {
6 | console.log(x + ' - ' + y + ' = ' + (x - y));
7 | }
8 |
9 | function multiply(x, y) {
10 | console.log(x + ' * ' + y + ' = ' + (x * y));
11 | }
12 |
13 | function divide(x, y) {
14 | console.log(x + ' / ' + y + ' = ' + (x / y));
15 | }
16 |
17 | add(2, 2);
18 | subtract(2, 2);
19 | multiply(3, 3);
20 | divide(3, 3);
21 |
22 | //Functions as objects
23 | function Person(firstName, lastName) {
24 | this.firstName = firstName;
25 | this.lastName = lastName;
26 | }
27 |
28 | var person = new Person('John', 'Doe');
29 | console.log(person.firstName + ' ' + person.lastName);
30 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsPrimer/loops.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Loops
5 |
6 |
7 | Loops
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 |
11 |
12 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsPrimer/loops.js:
--------------------------------------------------------------------------------
1 | console.log('\nUsing a for loop');
2 |
3 | var records = ['One', 'Two', 'Three'];
4 |
5 | for (var i = 0; i < records.length; i++) {
6 | console.log('On record: ' + records[i]);
7 | }
8 |
9 | console.log('\nUsing a for...in loop');
10 | var counter = 0;
11 | while (counter < records.length) {
12 | console.log('while loop found: ' + records[counter]);
13 | counter++;
14 | }
15 |
16 |
17 | var customer = {
18 | name: 'John Doe',
19 | age: 50
20 | };
21 |
22 | console.log('\nUsing a for...in loop');
23 | for (var key in customer) {
24 | console.log('Found property: ' + key + ' = ' + customer[key]);
25 | }
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsPrimer/objectsAndObjectLiterals.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Objects and Object Literals
5 |
6 |
7 | Objects and Object Literals
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 |
11 |
12 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsPrimer/objectsAndObjectLiterals.js:
--------------------------------------------------------------------------------
1 | //Object
2 | var Customer = function () { };
3 |
4 | var cust = new Customer();
5 | cust.firstName = 'John';
6 | cust.lastName = 'Doe';
7 |
8 | //Object Literal
9 | var customer = {
10 | firstName: 'Jane',
11 | lastName: 'Doe'
12 | };
13 |
14 | console.log('Customer Object: ' + cust.firstName + ' ' + cust.lastName);
15 | console.log('Customer Object Literal: ' + customer.firstName + ' ' + customer.lastName);
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsPrimer/useStrict.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | What is 'use strict'?
5 |
6 |
7 | What is 'use strict'?
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 | The 'use strict' option is in ECMASCript 5 and does the following:
11 |
12 | Places a program or function into a "strict" operating context
13 | Catches common coding bloopers, throwing exceptions
14 | Prevents or throws errors when "unsafe" actions are taken
15 | Disables confusing or poorly thought out features
16 |
17 | Note that this example generates a lot of errors (on purpose) to show 'use strict' in action.
18 |
19 |
20 |
21 |
22 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsPrimer/usingTypeOf.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Using the typeof Operator
5 |
6 |
7 | Using the typeof Operator
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 |
11 |
12 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsPrimer/usingTypeOf.js:
--------------------------------------------------------------------------------
1 | var Customer = function () { };
2 | var cust = new Customer();
3 | cust.firstName = 'John';
4 | cust.lastName = 'Doe';
5 |
6 | //Object Literal
7 | var customer = {
8 | firstName: 'Jane',
9 | lastName: 'Doe'
10 | };
11 |
12 | var pets = new Array('Fido', 'Maestro'); //Array
13 | var colors = ['Blue', 'Red', 'Yellow']; //Array
14 |
15 | //Using typeof
16 | console.log(typeof 4.5);
17 | // → number
18 | console.log(typeof 'Fred');
19 | // → string
20 | console.log(typeof true);
21 | // → boolean
22 | console.log(typeof cust);
23 | // → object
24 | console.log(typeof customer);
25 | // → object
26 | console.log(typeof pets);
27 | // → object
28 | console.log(typeof colors);
29 | // → object
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsPrimer/variablesAndTypes.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Variables and Types
5 |
6 |
7 | Variables and Types
8 | View the results in the debugging console (ctrl/cmd+shift+i)
9 |
10 |
11 |
12 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/jsPrimer/variablesAndTypes.js:
--------------------------------------------------------------------------------
1 | //Primary Types
2 | var age = 50; //number
3 | var total = 49.99; //number
4 | var fullName = 'John Doe'; //string
5 | var isRegistered = true; //boolean
6 |
7 | //Composite Types
8 | var pets = new Array('Fido', 'Maestro'); //Array
9 | var colors = ['Blue', 'Red', 'Yellow']; //Array
10 |
11 | //Special Types
12 | var street; //undefined
13 | var address = null; //null
14 |
15 | console.log('Age: ' + age);
16 | console.log('total: ' + total);
17 | console.log('fullName: ' + fullName);
18 | console.log('isRegistered: ' + isRegistered);
19 | console.log('pets: ' + pets.length + ' pets named ' + pets);
20 | console.log('colors: ' + colors.length + ' colors named ' + colors);
21 | console.log('street: ' + street);
22 | console.log('address: ' + address);
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/typescript/calculator.css:
--------------------------------------------------------------------------------
1 | body {
2 | }
3 |
4 | input {
5 | width: 30px;
6 | }
7 |
8 | button {
9 | width:60px;
10 | }
11 |
12 | .Calculator
13 | {
14 | width:200px;
15 | }
16 |
17 | #Output {
18 | font-weight:bold;
19 | font-size:16pt;
20 | }
21 |
22 |
23 |
24 |
25 |
26 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/typescript/calculator.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Using TypeScript
5 |
6 |
7 |
8 |
9 | TypeScript Calculator
10 |
11 |
12 | X:
13 | Y:
14 |
15 |
16 |
17 | Add
18 | Subtract
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/typescript/calculator.ts:
--------------------------------------------------------------------------------
1 | window.onload = function () {
2 | var calc = new Calculator('X','Y','Output');
3 | };
4 |
5 | class Calculator {
6 | private x : HTMLInputElement;
7 | private y : HTMLInputElement;
8 | private output : HTMLSpanElement;
9 |
10 | constructor(xId: string, yId: string, outputId: string) {
11 | this.x = document.getElementById(xId);
12 | this.y = document.getElementById(yId);
13 | this.output = document.getElementById(outputId);
14 | this.wireEvents();
15 | }
16 |
17 | wireEvents() {
18 | document.getElementById('Add').addEventListener('click',
19 | event => {
20 | this.output.innerHTML = this.add(parseInt(this.x.value), parseInt(this.y.value)).toString()
21 | });
22 | document.getElementById('Subtract').addEventListener('click',
23 | event => {
24 | this.output.innerHTML = this.subtract(parseInt(this.x.value), parseInt(this.y.value)).toString()
25 | });
26 | }
27 |
28 | add(x: number, y : number) {
29 | return x + y;
30 | }
31 |
32 | subtract(x : number, y: number) {
33 | return x - y;
34 | }
35 | }
36 |
37 |
38 |
39 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/typescript/calculatorJQuery.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Using TypeScript
5 |
6 |
7 |
8 |
9 |
10 | TypeScript Calculator
11 |
12 |
13 | X:
14 | Y:
15 |
16 |
17 |
18 | Add
19 | Subtract
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/typescript/calculatorJQuery.ts:
--------------------------------------------------------------------------------
1 | ///
2 |
3 | $(document).ready(function () {
4 | var calc = new CalculatorjQuery('X','Y','Output');
5 | });
6 |
7 | class CalculatorjQuery {
8 | private x : JQuery;
9 | private y : JQuery;
10 | private output : JQuery;
11 |
12 | constructor(xId: string, yId: string, outputId: string) {
13 | this.x = $('#' + xId);
14 | this.y = $('#' + yId);
15 | this.output = $('#' + outputId);
16 | this.wireEvents();
17 | }
18 |
19 | private wireEvents() {
20 | $('#Add').click(event => {
21 | this.output.html(this.add(parseInt(this.x.val()), parseInt(this.y.val())).toString());
22 | });
23 | $('#Subtract').click(event => {
24 | this.output.html(this.subtract(parseInt(this.x.val()), parseInt(this.y.val())).toString());
25 | });
26 | }
27 |
28 | add(x: number, y : number) {
29 | return x + y;
30 | }
31 |
32 | subtract(x : number, y: number) {
33 | return x - y;
34 | }
35 | }
36 |
37 |
38 |
39 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/typescript/classExtension.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | TypeScript HTML App
7 |
8 |
9 |
10 | Autos
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/typescript/definingClasses.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | TypeScript HTML App
6 |
7 |
8 |
9 | TypeScript HTML App
10 |
11 |
12 |
13 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/typescript/definingClasses.ts:
--------------------------------------------------------------------------------
1 | module DefiningClasses {
2 | class Engine {
3 | constructor(public horsePower: number, public engineType: string) { }
4 | }
5 |
6 | class Car {
7 | private _engine: Engine;
8 |
9 | constructor(engine: Engine) {
10 | this.engine = engine;
11 | }
12 |
13 | get engine(): Engine {
14 | return this._engine;
15 | }
16 |
17 | set engine(value: Engine) {
18 | if (value == undefined) throw 'Please supply an engine';
19 | this._engine = value;
20 | }
21 |
22 | start(): void {
23 | alert('Car engine started ' + this._engine.engineType);
24 | }
25 | }
26 |
27 | window.onload = function () {
28 | var engine = new Engine(300, 'V8');
29 | var car = new Car(engine);
30 | alert(car.engine.engineType);
31 | car.start();
32 | };
33 | }
34 |
35 |
36 |
37 |
38 |
--------------------------------------------------------------------------------
/Mastering JavaScript/samples/typescript/interfaces.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Using Interfaces
6 |
7 |
8 |
9 | Using Interfaces
10 |
11 |
12 |
13 |
--------------------------------------------------------------------------------
/Mastering JavaScript/server.js:
--------------------------------------------------------------------------------
1 | var express = require('express');
2 | var app = express();
3 |
4 | app.use(express.static(__dirname));
5 |
6 | app.listen(8000);
7 | console.log('Listening on port 8000');
--------------------------------------------------------------------------------
/Mastering JavaScript/styles/iframe.css:
--------------------------------------------------------------------------------
1 | body {
2 | font-family: Arial, Helvetica, sans-serif;
3 | }
4 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | Mastering JavaScript Course Code
2 | ==========
3 |
4 | This code is used in the Mastering JavaScript class offered by Wahlin Consulting (https://codewithdan.com/products/mastering-javascript). Contact us if you'd like to run the class at your company.
5 |
--------------------------------------------------------------------------------