├── .gitignore ├── README.md ├── _tuts ├── README.md ├── array-create-in-normal-way.diff ├── array-fix-removing-replogs.diff ├── array-pass-array-into-helper.diff ├── array-use-array-with-includes.diff ├── arrow-functions-convert-the-rest.diff ├── arrow-functions-full-body.diff ├── arrow-functions-no-around-arg.diff ├── arrow-functions-no-more-self.diff ├── arrow-functions-return-without-a-body.diff ├── arrow-functions-this-preserved.diff ├── arrow-functions-use-them-on-delete-ops.diff ├── babel-add-require-polyfill.diff ├── babel-exclude-cachedirectory-option.diff ├── babel-init-yarn.diff ├── babel-install-babel-cli.diff ├── babel-install-basic-usage.diff ├── babel-install-use-env-preset.diff ├── babel-transpile-replogapp-js.diff ├── babel-using-proper-loader.diff ├── basic-object-hitting-the-this-trap.diff ├── basic-object-more-helper-methods.diff ├── basic-object-refactor-to-basic-replogapp.diff ├── basic-object-using-static-syntax.diff ├── bootstrap-js-make-jquery-global.diff ├── bootstrap-js-refactor-layout-entry.diff ├── bootstrap-js-remove-jquery-bs-from-layout.diff ├── bootstrap-js-require-bootstrap.diff ├── bootstrap-js-use-provideplugin.diff ├── changes-feature-changes-before-webpack.diff ├── changes-upgrade-symfony.diff ├── classes-a-helper-static-method-example.diff ├── classes-basic-class-syntax.diff ├── classes-change-selectors-prop-to-method.diff ├── classes-export-replogapp-to-window.diff ├── classes-fully-convert-helper.diff ├── classes-moving-rest-of-replogapp-to-class.diff ├── classes-referencing-it-statically.diff ├── classes-showing-get-syntax.diff ├── classes-start-to-move-replogapp.diff ├── classes-static-method.diff ├── commonschunk-basic-plugin-usage.diff ├── commonschunk-dumping-manifest-js.diff ├── commonschunk-fix-tree-shaking.diff ├── commonschunk-use-layout-entry.diff ├── commonschunk-vendor-all-node-modules.diff ├── const-object-keys-not-protected.diff ├── const-removing-assignment.diff ├── const-try-it-out.diff ├── const-using-const-everywhere.diff ├── css-add-css-loader-only-print.diff ├── css-add-style-loader.diff ├── css-include-sweetalert2-css.diff ├── css-try-to-include-login-css.diff ├── currenttarget-this-confidently-use-this.diff ├── currenttarget-this-logging-e-currenttarget.diff ├── currenttarget-this-logging-e-target.diff ├── currenttarget-this-remove-delete-text.diff ├── currenttarget-this-show-identical.diff ├── currenttarget-this-use-this.diff ├── data-attribute-data-url-ajax-call.diff ├── data-attribute-update-total-weight.diff ├── default-args-add-arg-to-method.diff ├── default-args-new-gettotalweightstring-func.diff ├── default-args-use-default-arg.diff ├── delegate-using-delegate-selectors.diff ├── destructuring-default-for-bad-key.diff ├── destructuring-logging-replog.diff ├── destructuring-setting-local-vars-from-replog.diff ├── destructuring-using-a-bad-key.diff ├── devserver-add-contentbase.diff ├── devserver-install-use-it.diff ├── devserver-publicpath-to-dev-server.diff ├── dom-basics-document-ready.diff ├── dom-basics-js-back-to-footer.diff ├── dom-basics-our-js-back-into-footer.diff ├── dom-basics-script-in-middle-of-page.diff ├── dom-basics-scripts-in-header.diff ├── dom-basics-simple-click-listener.diff ├── ep2-prep-upgrade-deps.diff ├── event-bubbling-add-2nd-listener.diff ├── event-bubbling-event-argument.diff ├── event-bubbling-find-table-for-performance.diff ├── event-bubbling-remove-stoppropagation.diff ├── event-bubbling-returning-false.diff ├── event-target-console-dir-dom-element-object.diff ├── event-target-console-log-dom-element-object.diff ├── event-target-holds-a-collection-of-elements.diff ├── event-target-show-another-collection-example.diff ├── event-target-using-dom-element-directly.diff ├── event-target-using-event-target.diff ├── event-target-using-jquery-again.diff ├── export-use-export-default-everywhere.diff ├── extends-call-super-method.diff ├── extends-calling-super.diff ├── extends-create-a-simple-class.diff ├── extends-extend-with-a-new-class.diff ├── extends-override-constructor.diff ├── extends-override-method.diff ├── extracttext-install-use-it.diff ├── extracttext-stop-using-dev-server.diff ├── fonts-adding-fontawesome.diff ├── fonts-controlling-file-loader-name.diff ├── fonts-include-bootstrap-css.diff ├── for-of-use-for-of-everywhere.diff ├── fosjsroutingbundle-try-to-require.diff ├── fosjsroutingbundle-use-fake-routing-module.diff ├── iife-i-can-access-helper.diff ├── iife-passing-in-vars.diff ├── iife-refactor-into-private-helper-object.diff ├── iife-refactor-to-external-js.diff ├── iife-refactor-to-faux-private-method.diff ├── iife-wrap-in-iife.diff ├── images-add-file-loader-for-images.diff ├── images-adding-publicpath.diff ├── images-try-to-require-main-css.diff ├── import-import-only-one-library.diff ├── import-import-specific-file.diff ├── import-require-specific-file.diff ├── import-use-import-everywhere.diff ├── import-use-import.diff ├── import-use-use.diff ├── legacy-expose-globally.diff ├── legacy-update-provide-plugin-for-window.diff ├── legacy-use-global.diff ├── legacy-use-in-a-template.diff ├── let-change-to-all-let.diff ├── let-change-to-let-show-scoping.diff ├── let-log-a-completely-undefined-var.diff ├── let-log-before-a-let.diff ├── let-playing-with-var.diff ├── let-putting-second-var-in-new-function.diff ├── let-show-var-hoisting.diff ├── let-trying-it-once.diff ├── let-using-var-multiple-times.diff ├── let-without-another-let-same-var.diff ├── managing-this-changing-this-via-call.diff ├── managing-this-fixing-with-bind.diff ├── managing-this-logging-this.diff ├── managing-this-using-bind-on-callbacks.diff ├── managing-this-using-self.diff ├── managing-this-using-this-in-callback.diff ├── maps-creating-an-old-hash.diff ├── maps-map-prototype-has.diff ├── maps-use-a-nice-map.diff ├── maps-use-an-array-key.diff ├── maps-use-array-prorotype-size.diff ├── modules-organize-into-components.diff ├── modules-refactoring-to-rep-log-js-entry.diff ├── modules-remove-self-executing-function.diff ├── multipage-add-layout-entry.diff ├── multipage-multiple-entries.diff ├── multipage-refactor-login-js-to-be-a-module.diff ├── new-form-appending-row-on-success.diff ├── new-form-return-html-on-ajax.diff ├── new-form-setup-making-wrapper-bigger.diff ├── new-form-simple-ajax-submit.diff ├── new-form-updating-total.diff ├── node-first-node-play-script.diff ├── node-playing-with-arrow-functions.diff ├── npm-add-sweetalert2.diff ├── npm-add-use-jquery.diff ├── object-literals-funtion-key-shorthand.diff ├── object-literals-show-data-data.diff ├── object-literals-use-value-as-key-val.diff ├── organization-move-assets-to-root.diff ├── organization-use-copywebpackplugin.diff ├── pass-data-pass-initial-rep-logs-manually.diff ├── pass-data-use-data-attribute.diff ├── production-add-defineplugin.diff ├── production-add-loaderoptionsplugin.diff ├── production-adding-scripts-to-package-json.diff ├── production-conditionally-add-uglify.diff ├── production-disable-sourcemaps.diff ├── production-pass-minimize-directly-to-css-loader.diff ├── production-set-print-node-env.diff ├── promises-ajax-to-fetch-one-replog.diff ├── promises-changing-to-then.diff ├── promises-checking-error-instanceof.diff ├── promises-logging-data-throw-arg.diff ├── promises-massage-reject-value.diff ├── promises-preconfirm-with-real-promise.diff ├── promises-print-location-header-after-create.diff ├── promises-printing-location-header.diff ├── promises-putting-then-all-first.diff ├── promises-re-throw-and-2nd-catch.diff ├── promises-refactor-to-ajax-promise-format.diff ├── promises-refactor-to-save-method.diff ├── promises-reject.diff ├── promises-return-our-own-promise.diff ├── promises-returning-in-then.diff ├── promises-sweetalert2.diff ├── promises-using-catch-instead.diff ├── promises-using-catch.diff ├── promises-using-deletereplog-in-preconfirm.diff ├── promises-using-done-as-an-example.diff ├── promises-using-rejected-2nd-then-arg.diff ├── real-object-create-2-instances.diff ├── real-object-create-the-object-no-prototype.diff ├── real-object-playing-with-proto.diff ├── real-object-printing-object-vs-instance.diff ├── real-object-refactor-helper-syntax.diff ├── real-object-refactor-replogapp.diff ├── real-object-remove-debug-code.diff ├── real-object-string-array-proto.diff ├── real-object-use-extend.diff ├── real-object-use-prototype.diff ├── render-reps-install-fosjsroutingbundle.diff ├── render-reps-render-row-from-js.diff ├── require-extract-helper-to-its-own-class.diff ├── require-stop-using-dist-file.diff ├── require-using-require-in-node.diff ├── sass-add-resolve-url-loader.diff ├── sass-add-sass-loader.diff ├── sass-only-import-part-of-bootstrap.diff ├── sass-set-a-bootstrap-variable.diff ├── sass-try-using-scss-file.diff ├── sass-use-bootstrap-sass.diff ├── sass-use-import-for-vendor-sass.diff ├── set-create-array-of-foods.diff ├── set-use-set-items-are-unique.diff ├── sourcemaps-add-devtool-for-js.diff ├── sourcemaps-add-for-css-sass.diff ├── sourcemaps-refactoring-loaders.diff ├── splitting-adding-syntax-dynamic-import.diff ├── splitting-move-username-to-new-module.diff ├── splitting-split-css.diff ├── splitting-try-to-split-in-username-error.diff ├── splitting-use-default-key.diff ├── spread-operator-bad-copy-of-array.diff ├── spread-operator-combining-arrays.diff ├── spread-operator-copy-via-spread-op.diff ├── spread-operator-passing-4th-item.diff ├── spread-operator-simple-function-call-example.diff ├── steps.json ├── template-strings-add-expressions.diff ├── template-strings-expressions-with-undefined-vars.diff ├── template-strings-moving-template-with-single-quotes.diff ├── template-strings-removed-tagged-template.diff ├── template-strings-simple-example-no-ticks.diff ├── template-strings-tagged-template-for-upper.diff ├── template-strings-turn-tpl-into-function.diff ├── template-strings-using-ticks.diff ├── use-api-mapping-errors-onto-form.diff ├── use-api-print-data-back-from-success.diff ├── use-api-remove-ajax-controller-code.diff ├── use-api-render-template.diff ├── use-api-resetting-form-on-success.diff ├── use-api-send-json-form-submit.diff ├── use-api-simple-field-names.diff ├── use-api-starting-to-handle-errors.diff ├── use-api-stop-using-symfony-form.diff ├── versioning-add-hash.diff ├── versioning-add-manifestplugin.diff ├── versioning-add-version-strategy.diff ├── versioning-adding-chunkhashplugin.diff ├── versioning-always-dump-manifest.diff ├── versioning-clean-between-builds.diff ├── versioning-hashedidsplugin.diff ├── visualizer-use-partial-core-js.diff ├── watch-use-watch-make-a-change.diff ├── weakmap-change-to-weakmap.diff ├── weakmap-gc-experiment-with-map.diff ├── weakmap-make-helper-truly-private.diff ├── weakmap-removing-debug-code.diff ├── weakmap-set-ussouthernstates-to-null.diff ├── weakmap-use-map-for-multiple-instances.diff ├── weakmap-use-only-object-keys.diff ├── weakmap-using-weakmap-for-gc.diff ├── webpack-initial-webpack-config-js.diff ├── webpack-install-cli-use.diff ├── webpack-require-path.diff ├── webpack-try-to-use-path.diff ├── webpack-uninstall-babel.diff ├── window-forget-var.diff ├── window-re-add-var.diff ├── window-setting-our-var-on-window.diff ├── window-use-strict.diff └── window-window-is-this.diff ├── app ├── .htaccess ├── AppCache.php ├── AppKernel.php ├── DoctrineMigrations │ ├── Version20161115100817.php │ └── Version20170119105442.php ├── Resources │ ├── FOSUserBundle │ │ └── views │ │ │ ├── Registration │ │ │ └── register_content.html.twig │ │ │ ├── Security │ │ │ └── login.html.twig │ │ │ └── layout.html.twig │ ├── translations │ │ └── messages.en.yml │ └── views │ │ ├── base.html.twig │ │ └── lift │ │ ├── _form.html.twig │ │ ├── _leaderboard.html.twig │ │ └── index.html.twig ├── autoload.php └── config │ ├── config.yml │ ├── config_dev.yml │ ├── config_prod.yml │ ├── config_test.yml │ ├── parameters.yml.dist │ ├── routing.yml │ ├── routing_dev.yml │ ├── security.yml │ └── services.yml ├── bin ├── console └── symfony_requirements ├── composer.json ├── composer.lock ├── knpu ├── ep1-basics │ ├── ajax-form-submit.md │ ├── all-about-promises.md │ ├── api-endpoint-post.md │ ├── clear-form-prep-template.md │ ├── create-your-own-promise.md │ ├── data-attribute.md │ ├── delegate-selectors-ftw.md │ ├── document-ready-ordering.md │ ├── dom-element-object.md │ ├── event-bubbling.md │ ├── event-propagation.md │ ├── extend-prototype.md │ ├── fixing-this-bind.md │ ├── immediately-invoked-function-expression.md │ ├── instantiatable-objects-constructor.md │ ├── javascript-objects.md │ ├── javascript-templating.md │ ├── javascript.png │ ├── js-class-prefix.md │ ├── js-rendering-fosjsroutingbundle.md │ ├── js-validation-error-handling.md │ ├── metadata.yml │ ├── object-prototype.md │ ├── old-school-ajax-html.md │ ├── post-proper-api-endpoint.md │ ├── promise-catch-error.md │ ├── promise-chaining.md │ ├── promises-catch.md │ ├── prototype-proto.md │ ├── static-objects-this.md │ ├── sweet-alert-create-promise.md │ ├── sweet-alert-more-promises.md │ ├── this-current-target.md │ ├── understanding-this-magic.md │ └── window-global-vars.md ├── ep2-es6 │ ├── array-set.md │ ├── arrow-functions.md │ ├── babel.md │ ├── class-syntax.md │ ├── const.md │ ├── destructuring.md │ ├── ecmascript-es6-harmony.md │ ├── es │ │ ├── for-of-loop.md │ │ ├── for-of-loop.vtt │ │ ├── map-weak-map.md │ │ └── map-weak-map.vtt │ ├── extends-super-calls.md │ ├── for-of-loop.md │ ├── map-weak-map.md │ ├── metadata.yml │ ├── npm-yarn.md │ ├── object-literals-optional-args.md │ ├── private-vars-weak-map.md │ ├── rock-some-nodejs.md │ ├── spread-operator.md │ ├── static-class-methods.md │ ├── template-strings.md │ ├── var-let-hoisting.md │ └── var-let-scope.md ├── ep3-webpack │ ├── babel-options-polyfill.md │ ├── babel.md │ ├── bootstrap-fonts.md │ ├── bootstrap-sass-variables.md │ ├── bootstrap-sass.md │ ├── caching-versioning.md │ ├── code-splitting.md │ ├── commons-chunk-plugin.md │ ├── copy-webpack-plugin.md │ ├── es6-import-export.md │ ├── extract-text-webpack-plugin.md │ ├── file-loader-images.md │ ├── first-webpack.md │ ├── font-awesome.md │ ├── fosjsroutingbundle.md │ ├── global-jquery.md │ ├── hot-module-replacement.md │ ├── legacy-global-jquery.md │ ├── lodash-partial-require.md │ ├── metadata.yml │ ├── minify-css.md │ ├── modularize-our-code.md │ ├── multiple-entries.md │ ├── optimized-commons-chunk.md │ ├── pass-data-to-js.md │ ├── production-build.md │ ├── provide-plugin.md │ ├── require-css.md │ ├── require-sweet-alert.md │ ├── require.md │ ├── sass-loader.md │ ├── sourcemaps.md │ ├── versioning-manifest.md │ ├── versioning-optimization.md │ ├── visualizer.md │ ├── watch-require-jquery.md │ ├── webpack-config.md │ └── webpack-dev-server.md └── ep4-reactjs │ └── metadata.yml ├── phpunit.xml.dist ├── src ├── .htaccess └── AppBundle │ ├── Api │ └── RepLogApiModel.php │ ├── AppBundle.php │ ├── Controller │ ├── BaseController.php │ ├── DefaultController.php │ ├── LiftController.php │ └── RepLogController.php │ ├── DataFixtures │ └── ORM │ │ └── LoadReps.php │ ├── Entity │ ├── RepLog.php │ └── User.php │ ├── Form │ └── Type │ │ ├── RegistrationType.php │ │ └── RepLogType.php │ └── Repository │ └── RepLogRepository.php ├── tests └── AppBundle │ └── Controller │ └── DefaultControllerTest.php ├── tutorial └── upper.js ├── var ├── SymfonyRequirements.php ├── cache │ └── .gitkeep ├── logs │ └── .gitkeep └── sessions │ └── .gitkeep └── web ├── .htaccess ├── app.php ├── app_dev.php ├── apple-touch-icon.png ├── assets ├── css │ ├── login.css │ └── main.css └── images │ └── dumbbell.png ├── config.php ├── favicon.ico └── robots.txt /.gitignore: -------------------------------------------------------------------------------- 1 | /app/config/parameters.yml 2 | /build/ 3 | /phpunit.xml 4 | /var/* 5 | !/var/cache 6 | /var/cache/* 7 | !var/cache/.gitkeep 8 | !/var/logs 9 | /var/logs/* 10 | !var/logs/.gitkeep 11 | !/var/sessions 12 | /var/sessions/* 13 | !var/sessions/.gitkeep 14 | !var/SymfonyRequirements.php 15 | /vendor/ 16 | /web/bundles/ 17 | -------------------------------------------------------------------------------- /_tuts/README.md: -------------------------------------------------------------------------------- 1 | # Hello there! 2 | 3 | The files in this directory cannot be modified directly: we use an internal tool 4 | to manage them. If you find an issue with the code, you can open an issue on the 5 | repository. In fact, that would be awesome :). 6 | -------------------------------------------------------------------------------- /_tuts/array-create-in-normal-way.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 14993b1ad..062550f3f 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -7,7 +7,7 @@ 6 | class RepLogApp { 7 | constructor($wrapper) { 8 | this.$wrapper = $wrapper; 9 | - this.repLogs = new Array(); 10 | + this.repLogs = []; 11 | 12 | HelperInstances.set(this, new Helper($wrapper)); 13 | 14 | -------------------------------------------------------------------------------- /_tuts/array-fix-removing-replogs.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 9369f4bfd..84230608b 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -86,7 +86,15 @@ 6 | method: 'DELETE' 7 | }).then(() => { 8 | $row.fadeOut('normal', () => { 9 | + // we need to remove the repLog from this.repLogs 10 | + // the "key" is the index to this repLog on this.repLogs 11 | + this.repLogs.splice( 12 | + $row.data('key'), 13 | + 1 14 | + ); 15 | + 16 | $row.remove(); 17 | + 18 | this.updateTotalWeightLifted(); 19 | }); 20 | }) 21 | @@ -177,7 +185,10 @@ 22 | // console.log(id, itemLabel, reps, totallyMadeUpKey); 23 | 24 | const html = rowTemplate(repLog); 25 | - this.$wrapper.find('tbody').append($.parseHTML(html)); 26 | + const $row = $($.parseHTML(html)); 27 | + // store the repLogs index 28 | + $row.data('key', this.repLogs.length - 1); 29 | + this.$wrapper.find('tbody').append($row); 30 | 31 | this.updateTotalWeightLifted(); 32 | } 33 | -------------------------------------------------------------------------------- /_tuts/array-use-array-with-includes.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 640f9be6b..14993b1ad 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -7,6 +7,8 @@ 6 | class RepLogApp { 7 | constructor($wrapper) { 8 | this.$wrapper = $wrapper; 9 | + this.repLogs = new Array(); 10 | + 11 | HelperInstances.set(this, new Helper($wrapper)); 12 | 13 | this.loadRepLogs(); 14 | @@ -44,6 +46,7 @@ 15 | for (let repLog of data.items) { 16 | this._addRow(repLog); 17 | } 18 | + console.log(this.repLogs, this.repLogs.includes(data.items[0])); 19 | }) 20 | } 21 | 22 | @@ -169,6 +172,7 @@ 23 | } 24 | 25 | _addRow(repLog) { 26 | + this.repLogs.push(repLog); 27 | // destructuring example 28 | // let {id, itemLabel, reps, totallyMadeUpKey = 'whatever!'} = repLog; 29 | // console.log(id, itemLabel, reps, totallyMadeUpKey); 30 | -------------------------------------------------------------------------------- /_tuts/arrow-functions-full-body.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 05e48d474..f8e6bc4dd 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -33,7 +33,7 @@ 6 | var self = this; 7 | $.ajax({ 8 | url: Routing.generate('rep_log_list'), 9 | - }).then(function(data) { 10 | + }).then((data) => { 11 | $.each(data.items, function(key, repLog) { 12 | self._addRow(repLog); 13 | }); 14 | -------------------------------------------------------------------------------- /_tuts/arrow-functions-no-around-arg.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index f8e6bc4dd..29e8a1b39 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -33,7 +33,7 @@ 6 | var self = this; 7 | $.ajax({ 8 | url: Routing.generate('rep_log_list'), 9 | - }).then((data) => { 10 | + }).then(data => { 11 | $.each(data.items, function(key, repLog) { 12 | self._addRow(repLog); 13 | }); 14 | -------------------------------------------------------------------------------- /_tuts/arrow-functions-no-more-self.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index a9d77269e..a8fb81984 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -30,13 +30,11 @@ 6 | }, 7 | 8 | loadRepLogs: function() { 9 | - var self = this; 10 | $.ajax({ 11 | url: Routing.generate('rep_log_list'), 12 | }).then(data => { 13 | - console.log(this, self); 14 | - $.each(data.items, function(key, repLog) { 15 | - self._addRow(repLog); 16 | + $.each(data.items, (key, repLog) => { 17 | + this._addRow(repLog); 18 | }); 19 | }) 20 | }, 21 | -------------------------------------------------------------------------------- /_tuts/arrow-functions-return-without-a-body.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 6684e3aeb..0f93162f6 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -55,9 +55,7 @@ 6 | text: 'What? Did you not actually lift this?', 7 | showCancelButton: true, 8 | showLoaderOnConfirm: true, 9 | - preConfirm: () => { 10 | - return this._deleteRepLog($link); 11 | - } 12 | + preConfirm: () => this._deleteRepLog($link) 13 | }).catch((arg) => { 14 | // canceling is cool! 15 | }); 16 | -------------------------------------------------------------------------------- /_tuts/arrow-functions-this-preserved.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 29e8a1b39..a9d77269e 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -34,6 +34,7 @@ 6 | $.ajax({ 7 | url: Routing.generate('rep_log_list'), 8 | }).then(data => { 9 | + console.log(this, self); 10 | $.each(data.items, function(key, repLog) { 11 | self._addRow(repLog); 12 | }); 13 | -------------------------------------------------------------------------------- /_tuts/arrow-functions-use-them-on-delete-ops.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index a8fb81984..8e3fccb33 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -50,16 +50,15 @@ 6 | 7 | var $link = $(e.currentTarget); 8 | 9 | - var self = this; 10 | swal({ 11 | title: 'Delete this log?', 12 | text: 'What? Did you not actually lift this?', 13 | showCancelButton: true, 14 | showLoaderOnConfirm: true, 15 | - preConfirm: function() { 16 | - return self._deleteRepLog($link); 17 | + preConfirm: () => { 18 | + return this._deleteRepLog($link); 19 | } 20 | - }).catch(function(arg) { 21 | + }).catch((arg) => { 22 | // canceling is cool! 23 | }); 24 | }, 25 | @@ -73,15 +72,14 @@ 26 | 27 | var deleteUrl = $link.data('url'); 28 | var $row = $link.closest('tr'); 29 | - var self = this; 30 | 31 | return $.ajax({ 32 | url: deleteUrl, 33 | method: 'DELETE' 34 | - }).then(function() { 35 | - $row.fadeOut('normal', function () { 36 | - $(this).remove(); 37 | - self.updateTotalWeightLifted(); 38 | + }).then(() => { 39 | + $row.fadeOut('normal', () => { 40 | + $row.remove(); 41 | + this.updateTotalWeightLifted(); 42 | }); 43 | }) 44 | }, 45 | -------------------------------------------------------------------------------- /_tuts/babel-exclude-cachedirectory-option.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | index 0653020b5..26069b84e 100644 3 | --- a/webpack.config.js 4 | +++ b/webpack.config.js 5 | @@ -15,8 +15,12 @@ module.exports = { 6 | rules: [ 7 | { 8 | test: /\.js$/, 9 | + exclude: /node_modules/, 10 | use: { 11 | - loader: 'babel-loader' 12 | + loader: 'babel-loader', 13 | + options: { 14 | + cacheDirectory: true 15 | + } 16 | } 17 | } 18 | ] 19 | -------------------------------------------------------------------------------- /_tuts/babel-init-yarn.diff: -------------------------------------------------------------------------------- 1 | diff --git a/package.json b/package.json 2 | new file mode 100644 3 | index 000000000..f5d0db391 4 | --- /dev/null 5 | +++ b/package.json 6 | @@ -0,0 +1,8 @@ 7 | +{ 8 | + "name": "javascript", 9 | + "version": "1.0.0", 10 | + "main": "index.js", 11 | + "repository": "git@github.com:knpuniversity/javascript.git", 12 | + "author": "Ryan Weaver ", 13 | + "license": "MIT" 14 | +} 15 | -------------------------------------------------------------------------------- /_tuts/babel-using-proper-loader.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/rep_log.js b/web/assets/js/rep_log.js 2 | index af0ade30a..ca79a2866 100644 3 | --- a/web/assets/js/rep_log.js 4 | +++ b/web/assets/js/rep_log.js 5 | @@ -1,5 +1,5 @@ 6 | const $ = require('jquery'); 7 | -const RepLogApp = require('babel-loader!./Components/RepLogApp'); 8 | +const RepLogApp = require('./Components/RepLogApp'); 9 | 10 | $(document).ready(function() { 11 | var $wrapper = $('.js-rep-log-table'); 12 | diff --git a/webpack.config.js b/webpack.config.js 13 | index 21f77c0fd..0653020b5 100644 14 | --- a/webpack.config.js 15 | +++ b/webpack.config.js 16 | @@ -11,6 +11,16 @@ module.exports = { 17 | path: path.resolve(__dirname, 'web', 'build'), 18 | filename: '[name].js', 19 | }, 20 | + module: { 21 | + rules: [ 22 | + { 23 | + test: /\.js$/, 24 | + use: { 25 | + loader: 'babel-loader' 26 | + } 27 | + } 28 | + ] 29 | + }, 30 | plugins: [ 31 | new webpack.ProvidePlugin({ 32 | jQuery: 'jquery', 33 | -------------------------------------------------------------------------------- /_tuts/basic-object-hitting-the-this-trap.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index d24f89663..0e5e14cc0 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -94,7 +94,7 @@ 6 | 7 | var deleteUrl = $(this).data('url'); 8 | var $row = $(this).closest('tr'); 9 | - var $totalWeightContainer = $table.find('.js-total-weight'); 10 | + var $totalWeightContainer = this.$wrapper.find('.js-total-weight'); 11 | var newWeight = $totalWeightContainer.html() - $row.data('weight'); 12 | $.ajax({ 13 | url: deleteUrl, 14 | -------------------------------------------------------------------------------- /_tuts/basic-object-more-helper-methods.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index f25d9d5fe..8de061bea 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -83,6 +83,15 @@ 6 | ); 7 | }, 8 | 9 | + updateTotalWeightLifted: function() { 10 | + var totalWeight = 0; 11 | + this.$wrapper.find('tbody tr').each(function() { 12 | + totalWeight += $(this).data('weight'); 13 | + }); 14 | + 15 | + this.$wrapper.find('.js-total-weight').html(totalWeight); 16 | + }, 17 | + 18 | handleRepLogDelete: function(e) { 19 | e.preventDefault(); 20 | 21 | @@ -94,14 +103,14 @@ 22 | 23 | var deleteUrl = $(this).data('url'); 24 | var $row = $(this).closest('tr'); 25 | - var $totalWeightContainer = RepLogApp.$wrapper.find('.js-total-weight'); 26 | - var newWeight = $totalWeightContainer.html() - $row.data('weight'); 27 | $.ajax({ 28 | url: deleteUrl, 29 | method: 'DELETE', 30 | success: function() { 31 | - $row.fadeOut(); 32 | - $totalWeightContainer.html(newWeight); 33 | + $row.fadeOut('normal', function() { 34 | + $row.remove(); 35 | + RepLogApp.updateTotalWeightLifted(); 36 | + }); 37 | } 38 | }); 39 | }, 40 | -------------------------------------------------------------------------------- /_tuts/basic-object-using-static-syntax.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index 0e5e14cc0..f25d9d5fe 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -94,7 +94,7 @@ 6 | 7 | var deleteUrl = $(this).data('url'); 8 | var $row = $(this).closest('tr'); 9 | - var $totalWeightContainer = this.$wrapper.find('.js-total-weight'); 10 | + var $totalWeightContainer = RepLogApp.$wrapper.find('.js-total-weight'); 11 | var newWeight = $totalWeightContainer.html() - $row.data('weight'); 12 | $.ajax({ 13 | url: deleteUrl, 14 | -------------------------------------------------------------------------------- /_tuts/bootstrap-js-make-jquery-global.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/layout.js b/web/assets/js/layout.js 2 | index e9d87b70b..3628a4e37 100644 3 | --- a/web/assets/js/layout.js 4 | +++ b/web/assets/js/layout.js 5 | @@ -1,6 +1,7 @@ 6 | 'use strict'; 7 | 8 | const $ = require('jquery'); 9 | +window.jQuery = $; 10 | require('bootstrap'); 11 | 12 | $(document).ready(function() { 13 | -------------------------------------------------------------------------------- /_tuts/bootstrap-js-refactor-layout-entry.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/layout.js b/web/assets/js/layout.js 2 | index 881633d70..d7b544220 100644 3 | --- a/web/assets/js/layout.js 4 | +++ b/web/assets/js/layout.js 5 | @@ -1,7 +1,7 @@ 6 | 'use strict'; 7 | 8 | -(function(window, $) { 9 | - $(document).ready(function() { 10 | - $('[data-toggle="tooltip"]').tooltip(); 11 | - }); 12 | -})(window, jQuery); 13 | +const $ = require('jquery'); 14 | + 15 | +$(document).ready(function() { 16 | + $('[data-toggle="tooltip"]').tooltip(); 17 | +}); 18 | -------------------------------------------------------------------------------- /_tuts/bootstrap-js-remove-jquery-bs-from-layout.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/base.html.twig b/app/Resources/views/base.html.twig 2 | index 6c6daac2d..385bf770e 100644 3 | --- a/app/Resources/views/base.html.twig 4 | +++ b/app/Resources/views/base.html.twig 5 | @@ -97,8 +97,6 @@ 6 | 7 | 8 | {% block javascripts %} 9 | - 10 | - 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /_tuts/bootstrap-js-require-bootstrap.diff: -------------------------------------------------------------------------------- 1 | diff --git a/package.json b/package.json 2 | index 3eef178c6..5c4292bd2 100644 3 | --- a/package.json 4 | +++ b/package.json 5 | @@ -6,6 +6,7 @@ 6 | "author": "Ryan Weaver ", 7 | "license": "MIT", 8 | "devDependencies": { 9 | + "bootstrap": "^3.3.7", 10 | "jquery": "^3.2.1", 11 | "sweetalert2": "^6.6.6", 12 | "webpack": "^3.4.1" 13 | diff --git a/web/assets/js/layout.js b/web/assets/js/layout.js 14 | index d7b544220..e9d87b70b 100644 15 | --- a/web/assets/js/layout.js 16 | +++ b/web/assets/js/layout.js 17 | @@ -1,6 +1,7 @@ 18 | 'use strict'; 19 | 20 | const $ = require('jquery'); 21 | +require('bootstrap'); 22 | 23 | $(document).ready(function() { 24 | $('[data-toggle="tooltip"]').tooltip(); 25 | diff --git a/yarn.lock b/yarn.lock 26 | index f2420b194..f34ae067f 100644 27 | --- a/yarn.lock 28 | +++ b/yarn.lock 29 | @@ -174,6 +174,10 @@ boom@2.x.x: 30 | dependencies: 31 | hoek "2.x.x" 32 | 33 | +bootstrap@^3.3.7: 34 | + version "3.3.7" 35 | + resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-3.3.7.tgz#5a389394549f23330875a3b150656574f8a9eb71" 36 | + 37 | brace-expansion@^1.1.7: 38 | version "1.1.8" 39 | resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.8.tgz#c07b211c7c952ec1f8efd51a77ef0d1d3990a292" 40 | -------------------------------------------------------------------------------- /_tuts/bootstrap-js-use-provideplugin.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/layout.js b/web/assets/js/layout.js 2 | index 3628a4e37..e9d87b70b 100644 3 | --- a/web/assets/js/layout.js 4 | +++ b/web/assets/js/layout.js 5 | @@ -1,7 +1,6 @@ 6 | 'use strict'; 7 | 8 | const $ = require('jquery'); 9 | -window.jQuery = $; 10 | require('bootstrap'); 11 | 12 | $(document).ready(function() { 13 | diff --git a/webpack.config.js b/webpack.config.js 14 | index 308c607d6..21f77c0fd 100644 15 | --- a/webpack.config.js 16 | +++ b/webpack.config.js 17 | @@ -1,4 +1,5 @@ 18 | const path = require('path'); 19 | +const webpack = require('webpack'); 20 | 21 | module.exports = { 22 | entry: { 23 | @@ -9,5 +10,11 @@ module.exports = { 24 | output: { 25 | path: path.resolve(__dirname, 'web', 'build'), 26 | filename: '[name].js', 27 | - } 28 | + }, 29 | + plugins: [ 30 | + new webpack.ProvidePlugin({ 31 | + jQuery: 'jquery', 32 | + $: 'jquery' 33 | + }) 34 | + ] 35 | }; 36 | -------------------------------------------------------------------------------- /_tuts/classes-a-helper-static-method-example.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index d665a8686..140a90de0 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -184,12 +184,9 @@ 6 | } 7 | 8 | calculateTotalWeight() { 9 | - let totalWeight = 0; 10 | - this.$wrapper.find('tbody tr').each((index, element) => { 11 | - totalWeight += $(element).data('weight'); 12 | - }); 13 | - 14 | - return totalWeight; 15 | + return Helper._calculateWeights( 16 | + this.$wrapper.find('tbody tr') 17 | + ); 18 | } 19 | 20 | getTotalWeightString(maxWeight = 500) { 21 | @@ -201,6 +198,15 @@ 22 | 23 | return weight + ' lbs'; 24 | } 25 | + 26 | + static _calculateWeights($elements) { 27 | + let totalWeight = 0; 28 | + $elements.each((index, element) => { 29 | + totalWeight += $(element).data('weight'); 30 | + }); 31 | + 32 | + return totalWeight; 33 | + } 34 | } 35 | 36 | window.RepLogApp = RepLogApp; 37 | -------------------------------------------------------------------------------- /_tuts/classes-basic-class-syntax.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 46307f11f..7457e4634 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -173,6 +173,9 @@ 6 | /** 7 | * A "private" object 8 | */ 9 | + class Helper { 10 | + 11 | + } 12 | const Helper = function ($wrapper) { 13 | this.$wrapper = $wrapper; 14 | }; 15 | -------------------------------------------------------------------------------- /_tuts/classes-change-selectors-prop-to-method.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index b722dc82b..63ae1ab58 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -24,12 +24,16 @@ 6 | this.handleNewFormSubmit.bind(this) 7 | ); 8 | } 9 | + 10 | + _getSelectors() { 11 | + return { 12 | + newRepForm: '.js-new-rep-log-form' 13 | + } 14 | + } 15 | } 16 | 17 | $.extend(window.RepLogApp.prototype, { 18 | - _selectors: { 19 | - newRepForm: '.js-new-rep-log-form' 20 | - }, 21 | + 22 | 23 | loadRepLogs() { 24 | $.ajax({ 25 | -------------------------------------------------------------------------------- /_tuts/classes-export-replogapp-to-window.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 1bf3a158b..d719f3cbb 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -202,4 +202,6 @@ 6 | return weight + ' lbs'; 7 | } 8 | } 9 | + 10 | + window.RepLogApp = RepLogApp; 11 | })(window, jQuery, Routing, swal); 12 | -------------------------------------------------------------------------------- /_tuts/classes-fully-convert-helper.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 7457e4634..f85ede9b0 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -174,12 +174,10 @@ 6 | * A "private" object 7 | */ 8 | class Helper { 9 | + constructor($wrapper) { 10 | + this.$wrapper = $wrapper; 11 | + } 12 | 13 | - } 14 | - const Helper = function ($wrapper) { 15 | - this.$wrapper = $wrapper; 16 | - }; 17 | - $.extend(Helper.prototype, { 18 | calculateTotalWeight() { 19 | let totalWeight = 0; 20 | this.$wrapper.find('tbody tr').each((index, element) => { 21 | @@ -187,7 +185,7 @@ 22 | }); 23 | 24 | return totalWeight; 25 | - }, 26 | + } 27 | 28 | getTotalWeightString(maxWeight = 500) { 29 | let weight = this.calculateTotalWeight(); 30 | @@ -198,5 +196,5 @@ 31 | 32 | return weight + ' lbs'; 33 | } 34 | - }); 35 | + } 36 | })(window, jQuery, Routing, swal); 37 | -------------------------------------------------------------------------------- /_tuts/classes-referencing-it-statically.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 5a27d7c8e..d665a8686 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -20,7 +20,7 @@ 6 | ); 7 | this.$wrapper.on( 8 | 'submit', 9 | - this._selectors.newRepForm, 10 | + RepLogApp._selectors.newRepForm, 11 | this.handleNewFormSubmit.bind(this) 12 | ); 13 | } 14 | @@ -134,7 +134,7 @@ 15 | 16 | _mapErrorsToForm(errorData) { 17 | this._removeFormErrors(); 18 | - const $form = this.$wrapper.find(this._selectors.newRepForm); 19 | + const $form = this.$wrapper.find(RepLogApp._selectors.newRepForm); 20 | 21 | $form.find(':input').each((index, element) => { 22 | const fieldName = $(element).attr('name'); 23 | @@ -152,7 +152,7 @@ 24 | } 25 | 26 | _removeFormErrors() { 27 | - const $form = this.$wrapper.find(this._selectors.newRepForm); 28 | + const $form = this.$wrapper.find(RepLogApp._selectors.newRepForm); 29 | $form.find('.js-field-error').remove(); 30 | $form.find('.form-group').removeClass('has-error'); 31 | } 32 | @@ -160,7 +160,7 @@ 33 | _clearForm() { 34 | this._removeFormErrors(); 35 | 36 | - const $form = this.$wrapper.find(this._selectors.newRepForm); 37 | + const $form = this.$wrapper.find(RepLogApp._selectors.newRepForm); 38 | $form[0].reset(); 39 | } 40 | 41 | -------------------------------------------------------------------------------- /_tuts/classes-showing-get-syntax.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index ba3f4a93c..1bf3a158b 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -25,7 +25,10 @@ 6 | ); 7 | } 8 | 9 | - _getSelectors() { 10 | + /** 11 | + * Call like this.selectors 12 | + */ 13 | + get _selectors() { 14 | return { 15 | newRepForm: '.js-new-rep-log-form' 16 | } 17 | -------------------------------------------------------------------------------- /_tuts/classes-static-method.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index d719f3cbb..5a27d7c8e 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -28,7 +28,7 @@ 6 | /** 7 | * Call like this.selectors 8 | */ 9 | - get _selectors() { 10 | + static get _selectors() { 11 | return { 12 | newRepForm: '.js-new-rep-log-form' 13 | } 14 | -------------------------------------------------------------------------------- /_tuts/commonschunk-basic-plugin-usage.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/base.html.twig b/app/Resources/views/base.html.twig 2 | index 1205992a2..a3cb3dc3f 100644 3 | --- a/app/Resources/views/base.html.twig 4 | +++ b/app/Resources/views/base.html.twig 5 | @@ -95,6 +95,7 @@ 6 | {% block javascripts %} 7 | 8 | 9 | + 10 | 11 | {% endblock %} 12 | 13 | diff --git a/webpack.config.js b/webpack.config.js 14 | index ef77a49b8..65db612e8 100644 15 | --- a/webpack.config.js 16 | +++ b/webpack.config.js 17 | @@ -102,6 +102,11 @@ module.exports = { 18 | // copies to {output}/static 19 | { from: './assets/static', to: 'static' } 20 | ]), 21 | + 22 | + new webpack.optimize.CommonsChunkPlugin({ 23 | + name: 'vendor', 24 | + minChunks: 2, 25 | + }) 26 | ], 27 | devtool: 'inline-source-map' 28 | }; 29 | -------------------------------------------------------------------------------- /_tuts/commonschunk-dumping-manifest-js.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/base.html.twig b/app/Resources/views/base.html.twig 2 | index 1205992a2..5e680a418 100644 3 | --- a/app/Resources/views/base.html.twig 4 | +++ b/app/Resources/views/base.html.twig 5 | @@ -95,6 +95,7 @@ 6 | {% block javascripts %} 7 | 8 | 9 | + 10 | 11 | {% endblock %} 12 | 13 | diff --git a/webpack.config.js b/webpack.config.js 14 | index 5347fccd5..316b084f4 100644 15 | --- a/webpack.config.js 16 | +++ b/webpack.config.js 17 | @@ -104,9 +104,13 @@ module.exports = { 18 | ]), 19 | 20 | new webpack.optimize.CommonsChunkPlugin({ 21 | - // "layout" is an entry file 22 | - // anything included in layout, is not included in other output files 23 | - name: 'layout', 24 | + name: [ 25 | + // "layout" is an entry file 26 | + // anything included in layout, is not included in other output files 27 | + 'layout', 28 | + // dumps the manifest into a separate file 29 | + 'manifest' 30 | + ], 31 | minChunks: Infinity 32 | }) 33 | ], 34 | -------------------------------------------------------------------------------- /_tuts/commonschunk-fix-tree-shaking.diff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/knpuniversity/javascript/b4da7693cb6302bf668d6c8cd590031a5319cdc2/_tuts/commonschunk-fix-tree-shaking.diff -------------------------------------------------------------------------------- /_tuts/commonschunk-use-layout-entry.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/base.html.twig b/app/Resources/views/base.html.twig 2 | index a3cb3dc3f..1205992a2 100644 3 | --- a/app/Resources/views/base.html.twig 4 | +++ b/app/Resources/views/base.html.twig 5 | @@ -95,7 +95,6 @@ 6 | {% block javascripts %} 7 | 8 | 9 | - 10 | 11 | {% endblock %} 12 | 13 | diff --git a/webpack.config.js b/webpack.config.js 14 | index 89fcc6d52..5347fccd5 100644 15 | --- a/webpack.config.js 16 | +++ b/webpack.config.js 17 | @@ -104,10 +104,10 @@ module.exports = { 18 | ]), 19 | 20 | new webpack.optimize.CommonsChunkPlugin({ 21 | - name: 'vendor', 22 | - minChunks: function (module) { 23 | - return module.context && module.context.indexOf("node_modules") !== -1; 24 | - } 25 | + // "layout" is an entry file 26 | + // anything included in layout, is not included in other output files 27 | + name: 'layout', 28 | + minChunks: Infinity 29 | }) 30 | ], 31 | devtool: 'inline-source-map' 32 | -------------------------------------------------------------------------------- /_tuts/commonschunk-vendor-all-node-modules.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | index 65db612e8..89fcc6d52 100644 3 | --- a/webpack.config.js 4 | +++ b/webpack.config.js 5 | @@ -105,7 +105,9 @@ module.exports = { 6 | 7 | new webpack.optimize.CommonsChunkPlugin({ 8 | name: 'vendor', 9 | - minChunks: 2, 10 | + minChunks: function (module) { 11 | + return module.context && module.context.indexOf("node_modules") !== -1; 12 | + } 13 | }) 14 | ], 15 | devtool: 'inline-source-map' 16 | -------------------------------------------------------------------------------- /_tuts/const-object-keys-not-protected.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index 7a8ff740b..ab4a96d30 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,4 +1,7 @@ 6 | const aGreatNumber = 10; 7 | +const aGreatObject = { withGreatKeys: true }; 8 | + 9 | +aGreatObject.withGreatKeys = false; 10 | 11 | if (true) { 12 | //aGreatNumber = 42; 13 | @@ -6,6 +9,7 @@ if (true) { 14 | 15 | setTimeout(() => { 16 | console.log(aGreatNumber); 17 | + console.log(aGreatObject) 18 | }, 1000); 19 | 20 | console.log('waiting...'); 21 | -------------------------------------------------------------------------------- /_tuts/const-removing-assignment.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index a7d774186..7a8ff740b 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,7 +1,7 @@ 6 | const aGreatNumber = 10; 7 | 8 | if (true) { 9 | - aGreatNumber = 42; 10 | + //aGreatNumber = 42; 11 | } 12 | 13 | setTimeout(() => { 14 | -------------------------------------------------------------------------------- /_tuts/const-try-it-out.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index d00062c90..a7d774186 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,5 +1,4 @@ 6 | -console.log(aGreatNumber); 7 | -var aGreatNumber = 10; 8 | +const aGreatNumber = 10; 9 | 10 | if (true) { 11 | aGreatNumber = 42; 12 | -------------------------------------------------------------------------------- /_tuts/css-add-style-loader.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/login.js b/web/assets/js/login.js 2 | index e92448ba4..479c6e39c 100644 3 | --- a/web/assets/js/login.js 4 | +++ b/web/assets/js/login.js 5 | @@ -1,8 +1,7 @@ 6 | 'use strict'; 7 | 8 | const $ = require('jquery'); 9 | -const css = require('../css/login.css'); 10 | -console.log(css); 11 | +require('../css/login.css'); 12 | 13 | $(document).ready(function() { 14 | $('.js-recommended-login').on('click', '.js-show-login', function(e) { 15 | diff --git a/webpack.config.js b/webpack.config.js 16 | index 4b519729d..ebb889657 100644 17 | --- a/webpack.config.js 18 | +++ b/webpack.config.js 19 | @@ -26,7 +26,8 @@ module.exports = { 20 | { 21 | test: /\.css$/, 22 | use: [ 23 | - 'css-loader' 24 | + 'style-loader', 25 | + 'css-loader', 26 | ] 27 | } 28 | ] 29 | -------------------------------------------------------------------------------- /_tuts/css-include-sweetalert2-css.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index a8f2a3c48..2c1fe8a80 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -45,12 +45,6 @@ 6 | 7 | {% endblock %} 8 | 9 | -{% block stylesheets %} 10 | - {{ parent() }} 11 | - 12 | - 13 | -{% endblock %} 14 | - 15 | {% block javascripts %} 16 | {{ parent() }} 17 | 18 | diff --git a/web/assets/js/Components/RepLogApp.js b/web/assets/js/Components/RepLogApp.js 19 | index 51ba1d2d2..6c287f6b1 100644 20 | --- a/web/assets/js/Components/RepLogApp.js 21 | +++ b/web/assets/js/Components/RepLogApp.js 22 | @@ -3,6 +3,7 @@ 23 | const Helper = require('./RepLogAppHelper'); 24 | const $ = require('jquery'); 25 | const swal = require('sweetalert2'); 26 | +require('sweetalert2/dist/sweetalert2.css'); 27 | 28 | let HelperInstances = new WeakMap(); 29 | 30 | -------------------------------------------------------------------------------- /_tuts/css-try-to-include-login-css.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/FOSUserBundle/views/Security/login.html.twig b/app/Resources/FOSUserBundle/views/Security/login.html.twig 2 | index 1e2ce3ca5..e982bbd7e 100644 3 | --- a/app/Resources/FOSUserBundle/views/Security/login.html.twig 4 | +++ b/app/Resources/FOSUserBundle/views/Security/login.html.twig 5 | @@ -2,12 +2,6 @@ 6 | 7 | {% trans_default_domain 'FOSUserBundle' %} 8 | 9 | -{% block stylesheets %} 10 | - {{ parent() }} 11 | - 12 | - 13 | -{% endblock %} 14 | - 15 | {% block javascripts %} 16 | {{ parent() }} 17 | 18 | diff --git a/web/assets/js/login.js b/web/assets/js/login.js 19 | index 7daf09dc9..479c6e39c 100644 20 | --- a/web/assets/js/login.js 21 | +++ b/web/assets/js/login.js 22 | @@ -1,6 +1,7 @@ 23 | 'use strict'; 24 | 25 | const $ = require('jquery'); 26 | +require('../css/login.css'); 27 | 28 | $(document).ready(function() { 29 | $('.js-recommended-login').on('click', '.js-show-login', function(e) { 30 | -------------------------------------------------------------------------------- /_tuts/currenttarget-this-confidently-use-this.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index dbb2bf092..5265f5f60 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -74,6 +74,10 @@ 6 | e.preventDefault(); 7 | 8 | $(this).addClass('text-danger'); 9 | + $(this).find('.fa') 10 | + .removeClass('fa-trash') 11 | + .addClass('fa-spinner') 12 | + .addClass('fa-spin'); 13 | }); 14 | 15 | $table.find('tbody tr').on('click', function() { 16 | -------------------------------------------------------------------------------- /_tuts/currenttarget-this-logging-e-currenttarget.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index 7f6d834af..fe984078e 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -74,7 +74,7 @@ 6 | e.preventDefault(); 7 | 8 | $(e.target).addClass('text-danger'); 9 | - console.log(e.target); 10 | + console.log(e.currentTarget); 11 | }); 12 | 13 | $table.find('tbody tr').on('click', function() { 14 | -------------------------------------------------------------------------------- /_tuts/currenttarget-this-logging-e-target.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index e635f74a2..7f6d834af 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -28,6 +28,7 @@ 6 | 7 | 8 | 9 | + Delete 10 | 11 | 12 | 13 | @@ -73,6 +74,7 @@ 14 | e.preventDefault(); 15 | 16 | $(e.target).addClass('text-danger'); 17 | + console.log(e.target); 18 | }); 19 | 20 | $table.find('tbody tr').on('click', function() { 21 | -------------------------------------------------------------------------------- /_tuts/currenttarget-this-remove-delete-text.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index 5265f5f60..26dbdcbdd 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -28,7 +28,6 @@ 6 | 7 | 8 | 9 | - Delete 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /_tuts/currenttarget-this-show-identical.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index fe984078e..31b50b6b1 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -74,7 +74,7 @@ 6 | e.preventDefault(); 7 | 8 | $(e.target).addClass('text-danger'); 9 | - console.log(e.currentTarget); 10 | + console.log(e.currentTarget === this); 11 | }); 12 | 13 | $table.find('tbody tr').on('click', function() { 14 | -------------------------------------------------------------------------------- /_tuts/currenttarget-this-use-this.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index 31b50b6b1..dbb2bf092 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -73,8 +73,7 @@ 6 | $table.find('.js-delete-rep-log').on('click', function (e) { 7 | e.preventDefault(); 8 | 9 | - $(e.target).addClass('text-danger'); 10 | - console.log(e.currentTarget === this); 11 | + $(this).addClass('text-danger'); 12 | }); 13 | 14 | $table.find('tbody tr').on('click', function() { 15 | -------------------------------------------------------------------------------- /_tuts/data-attribute-data-url-ajax-call.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index 26dbdcbdd..c45499ff4 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -26,7 +26,10 @@ 6 | {{ repLog.reps }} 7 | {{ repLog.totalWeightLifted }} 8 | 9 | - 10 | + 14 | 15 | 16 | 17 | @@ -77,6 +80,16 @@ 18 | .removeClass('fa-trash') 19 | .addClass('fa-spinner') 20 | .addClass('fa-spin'); 21 | + 22 | + var deleteUrl = $(this).data('url'); 23 | + var $row = $(this).closest('tr'); 24 | + $.ajax({ 25 | + url: deleteUrl, 26 | + method: 'DELETE', 27 | + success: function() { 28 | + $row.fadeOut(); 29 | + } 30 | + }); 31 | }); 32 | 33 | $table.find('tbody tr').on('click', function() { 34 | -------------------------------------------------------------------------------- /_tuts/data-attribute-update-total-weight.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index c45499ff4..238d648a7 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -21,7 +21,7 @@ 6 | 7 | 8 | {% for repLog in repLogs %} 9 | - 10 | + 11 | {{ repLog.itemLabel|trans }} 12 | {{ repLog.reps }} 13 | {{ repLog.totalWeightLifted }} 14 | @@ -44,7 +44,7 @@ 15 | 16 |   17 | Total 18 | - {{ totalWeight }} 19 | + {{ totalWeight }} 20 |   21 | 22 | 23 | @@ -83,11 +83,14 @@ 24 | 25 | var deleteUrl = $(this).data('url'); 26 | var $row = $(this).closest('tr'); 27 | + var $totalWeightContainer = $table.find('.js-total-weight'); 28 | + var newWeight = $totalWeightContainer.html() - $row.data('weight'); 29 | $.ajax({ 30 | url: deleteUrl, 31 | method: 'DELETE', 32 | success: function() { 33 | $row.fadeOut(); 34 | + $totalWeightContainer.html(newWeight); 35 | } 36 | }); 37 | }); 38 | -------------------------------------------------------------------------------- /_tuts/default-args-add-arg-to-method.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 158aa31e6..e531465ad 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -41,7 +41,7 @@ 6 | 7 | updateTotalWeightLifted() { 8 | this.$wrapper.find('.js-total-weight').html( 9 | - this.helper.getTotalWeightString() 10 | + this.helper.getTotalWeightString(500) 11 | ); 12 | }, 13 | 14 | @@ -186,8 +186,14 @@ 15 | return totalWeight; 16 | }, 17 | 18 | - getTotalWeightString() { 19 | - return this.calculateTotalWeight() + ' lbs'; 20 | + getTotalWeightString(maxWeight) { 21 | + let weight = this.calculateTotalWeight(); 22 | + 23 | + if (weight > maxWeight) { 24 | + weight = maxWeight + '+'; 25 | + } 26 | + 27 | + return weight + ' lbs'; 28 | } 29 | }); 30 | })(window, jQuery, Routing, swal); 31 | -------------------------------------------------------------------------------- /_tuts/default-args-new-gettotalweightstring-func.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 3bd5c7e89..158aa31e6 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -41,7 +41,7 @@ 6 | 7 | updateTotalWeightLifted() { 8 | this.$wrapper.find('.js-total-weight').html( 9 | - this.helper.calculateTotalWeight() 10 | + this.helper.getTotalWeightString() 11 | ); 12 | }, 13 | 14 | @@ -184,6 +184,10 @@ 15 | }); 16 | 17 | return totalWeight; 18 | + }, 19 | + 20 | + getTotalWeightString() { 21 | + return this.calculateTotalWeight() + ' lbs'; 22 | } 23 | }); 24 | })(window, jQuery, Routing, swal); 25 | -------------------------------------------------------------------------------- /_tuts/default-args-use-default-arg.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index e531465ad..46307f11f 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -41,7 +41,7 @@ 6 | 7 | updateTotalWeightLifted() { 8 | this.$wrapper.find('.js-total-weight').html( 9 | - this.helper.getTotalWeightString(500) 10 | + this.helper.getTotalWeightString() 11 | ); 12 | }, 13 | 14 | @@ -186,7 +186,7 @@ 15 | return totalWeight; 16 | }, 17 | 18 | - getTotalWeightString(maxWeight) { 19 | + getTotalWeightString(maxWeight = 500) { 20 | let weight = this.calculateTotalWeight(); 21 | 22 | if (weight > maxWeight) { 23 | -------------------------------------------------------------------------------- /_tuts/delegate-using-delegate-selectors.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 4cfed016e..ce9b13457 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -5,16 +5,19 @@ 6 | this.$wrapper = $wrapper; 7 | this.helper = new Helper(this.$wrapper); 8 | 9 | - this.$wrapper.find('.js-delete-rep-log').on( 10 | + this.$wrapper.on( 11 | 'click', 12 | + '.js-delete-rep-log', 13 | this.handleRepLogDelete.bind(this) 14 | ); 15 | - this.$wrapper.find('tbody tr').on( 16 | + this.$wrapper.on( 17 | 'click', 18 | + 'tbody tr', 19 | this.handleRowClick.bind(this) 20 | ); 21 | - this.$wrapper.find('.js-new-rep-log-form').on( 22 | + this.$wrapper.on( 23 | 'submit', 24 | + '.js-new-rep-log-form', 25 | this.handleNewFormSubmit.bind(this) 26 | ); 27 | }; 28 | -------------------------------------------------------------------------------- /_tuts/destructuring-default-for-bad-key.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 591cf3014..12ad8c96c 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -165,7 +165,7 @@ 6 | } 7 | 8 | _addRow(repLog) { 9 | - let {id, itemLabel, reps, totallyMadeUpKey} = repLog; 10 | + let {id, itemLabel, reps, totallyMadeUpKey = 'whatever!'} = repLog; 11 | console.log(id, itemLabel, reps, totallyMadeUpKey); 12 | 13 | const tplText = $('#js-rep-log-row-template').html(); 14 | -------------------------------------------------------------------------------- /_tuts/destructuring-logging-replog.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 140a90de0..a16d7d9da 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -165,6 +165,8 @@ 6 | } 7 | 8 | _addRow(repLog) { 9 | + console.log(repLog); 10 | + 11 | const tplText = $('#js-rep-log-row-template').html(); 12 | const tpl = _.template(tplText); 13 | 14 | -------------------------------------------------------------------------------- /_tuts/destructuring-setting-local-vars-from-replog.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index a16d7d9da..4acb7cf42 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -165,7 +165,8 @@ 6 | } 7 | 8 | _addRow(repLog) { 9 | - console.log(repLog); 10 | + let {id, itemLabel, reps} = repLog; 11 | + console.log(id, itemLabel, reps); 12 | 13 | const tplText = $('#js-rep-log-row-template').html(); 14 | const tpl = _.template(tplText); 15 | -------------------------------------------------------------------------------- /_tuts/destructuring-using-a-bad-key.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 4acb7cf42..591cf3014 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -165,8 +165,8 @@ 6 | } 7 | 8 | _addRow(repLog) { 9 | - let {id, itemLabel, reps} = repLog; 10 | - console.log(id, itemLabel, reps); 11 | + let {id, itemLabel, reps, totallyMadeUpKey} = repLog; 12 | + console.log(id, itemLabel, reps, totallyMadeUpKey); 13 | 14 | const tplText = $('#js-rep-log-row-template').html(); 15 | const tpl = _.template(tplText); 16 | -------------------------------------------------------------------------------- /_tuts/devserver-add-contentbase.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/config/config_dev.yml b/app/config/config_dev.yml 2 | index 7eb4739c0..588916ff7 100644 3 | --- a/app/config/config_dev.yml 4 | +++ b/app/config/config_dev.yml 5 | @@ -6,6 +6,8 @@ framework: 6 | resource: "%kernel.root_dir%/config/routing_dev.yml" 7 | strict_requirements: true 8 | profiler: { only_exceptions: false } 9 | + assets: 10 | + base_url: 'http://localhost:8080' 11 | 12 | web_profiler: 13 | toolbar: true 14 | diff --git a/webpack.config.js b/webpack.config.js 15 | index 316b084f4..c948a1ad8 100644 16 | --- a/webpack.config.js 17 | +++ b/webpack.config.js 18 | @@ -114,5 +114,8 @@ module.exports = { 19 | minChunks: Infinity 20 | }) 21 | ], 22 | - devtool: 'inline-source-map' 23 | + devtool: 'inline-source-map', 24 | + devServer: { 25 | + contentBase: './web', 26 | + } 27 | }; 28 | -------------------------------------------------------------------------------- /_tuts/devserver-publicpath-to-dev-server.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | index c948a1ad8..df2a104fd 100644 3 | --- a/webpack.config.js 4 | +++ b/webpack.config.js 5 | @@ -2,6 +2,9 @@ const path = require('path'); 6 | const webpack = require('webpack'); 7 | const CopyWebpackPlugin = require('copy-webpack-plugin'); 8 | 9 | +const useDevServer = true; 10 | +const publicPath = useDevServer ? 'http://localhost:8080/build/' : '/build/'; 11 | + 12 | const styleLoader = { 13 | loader: 'style-loader', 14 | options: { 15 | @@ -27,7 +30,6 @@ const resolveUrlLoader = { 16 | } 17 | }; 18 | 19 | - 20 | module.exports = { 21 | entry: { 22 | rep_log: './assets/js/rep_log.js', 23 | @@ -37,7 +39,7 @@ module.exports = { 24 | output: { 25 | path: path.resolve(__dirname, 'web', 'build'), 26 | filename: '[name].js', 27 | - publicPath: '/build/' 28 | + publicPath: publicPath, 29 | }, 30 | module: { 31 | rules: [ 32 | @@ -117,5 +119,6 @@ module.exports = { 33 | devtool: 'inline-source-map', 34 | devServer: { 35 | contentBase: './web', 36 | + headers: { 'Access-Control-Allow-Origin': '*' }, 37 | } 38 | }; 39 | -------------------------------------------------------------------------------- /_tuts/dom-basics-document-ready.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index 90766e927..1b9c4089e 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -67,8 +67,10 @@ 6 | {{ parent() }} 7 | 8 | 17 | {% endblock %} 18 | -------------------------------------------------------------------------------- /_tuts/dom-basics-js-back-to-footer.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/base.html.twig b/app/Resources/views/base.html.twig 2 | index a1e0c2194..10e722ab0 100644 3 | --- a/app/Resources/views/base.html.twig 4 | +++ b/app/Resources/views/base.html.twig 5 | @@ -14,11 +14,6 @@ 6 | 7 | {% endblock %} 8 | 9 | - {% block javascripts %} 10 | - 11 | - 12 | - {% endblock %} 13 | - 14 | 15 | 16 | 17 | @@ -93,5 +88,10 @@ 18 | 19 | 20 | 21 | +{% block javascripts %} 22 | + 23 | + 24 | +{% endblock %} 25 | + 26 | 27 | 28 | -------------------------------------------------------------------------------- /_tuts/dom-basics-our-js-back-into-footer.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index ca7451e2a..65fc78a1e 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -47,14 +47,6 @@ 6 | 7 | 8 | 9 | - 16 | - 17 | {{ include('lift/_form.html.twig') }} 18 | 19 |
20 | @@ -73,4 +65,11 @@ 21 | {% block javascripts %} 22 | {{ parent() }} 23 | 24 | + 31 | {% endblock %} 32 | -------------------------------------------------------------------------------- /_tuts/dom-basics-script-in-middle-of-page.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index 1b9c4089e..ca7451e2a 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -47,8 +47,15 @@ 6 | 7 | 8 | 9 | - {{ include('lift/_form.html.twig') }} 10 | + 17 | 18 | + {{ include('lift/_form.html.twig') }} 19 |
20 |
21 |
22 | @@ -66,11 +73,4 @@ 23 | {% block javascripts %} 24 | {{ parent() }} 25 | 26 | - 33 | {% endblock %} 34 | -------------------------------------------------------------------------------- /_tuts/dom-basics-scripts-in-header.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/base.html.twig b/app/Resources/views/base.html.twig 2 | index cfea85507..a1e0c2194 100644 3 | --- a/app/Resources/views/base.html.twig 4 | +++ b/app/Resources/views/base.html.twig 5 | @@ -14,6 +14,11 @@ 6 | 7 | {% endblock %} 8 | 9 | + {% block javascripts %} 10 | + 11 | + 12 | + {% endblock %} 13 | + 14 | 15 | 16 | 17 | @@ -88,9 +93,5 @@ 18 |
19 | 20 | 21 | -{% block javascripts %} 22 | - 23 | - 24 | -{% endblock %} 25 | 26 | 27 | -------------------------------------------------------------------------------- /_tuts/dom-basics-simple-click-listener.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index e1bfba992..90766e927 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -26,7 +26,9 @@ 6 | {{ repLog.reps }} 7 | {{ repLog.totalWeightLifted }} 8 | 9 | -   10 | + 11 | + 12 | + 13 | 14 | 15 | {% else %} 16 | @@ -60,3 +62,13 @@ 17 |
18 | 19 | {% endblock %} 20 | + 21 | +{% block javascripts %} 22 | + {{ parent() }} 23 | + 24 | + 29 | +{% endblock %} 30 | -------------------------------------------------------------------------------- /_tuts/event-bubbling-add-2nd-listener.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index 65fc78a1e..4570fc6aa 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -10,7 +10,7 @@ 6 | 7 | 8 | 9 | - 10 | +
11 | 12 | 13 | 14 | @@ -70,6 +70,10 @@ 15 | $('.js-delete-rep-log').on('click', function () { 16 | console.log('todo delete!'); 17 | }); 18 | + 19 | + $('.js-rep-log-table tbody tr').on('click', function() { 20 | + console.log('row clicked!'); 21 | + }); 22 | }); 23 | 24 | {% endblock %} 25 | -------------------------------------------------------------------------------- /_tuts/event-bubbling-event-argument.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index 365e03440..eae7493f2 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -69,10 +69,11 @@ 6 | $(document).ready(function() { 7 | var $table = $('.js-rep-log-table'); 8 | 9 | - $table.find('.js-delete-rep-log').on('click', function () { 10 | - console.log('todo delete!'); 11 | + $table.find('.js-delete-rep-log').on('click', function (e) { 12 | + e.preventDefault(); 13 | + e.stopPropagation(); 14 | 15 | - return false; 16 | + console.log('todo delete!'); 17 | }); 18 | 19 | $table.find('tbody tr').on('click', function() { 20 | -------------------------------------------------------------------------------- /_tuts/event-bubbling-find-table-for-performance.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index 4570fc6aa..f2f999518 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -67,11 +67,13 @@ 6 | 7 | 7 | 8 | 18 | + 19 | + 27 | {% endblock %} 28 | -------------------------------------------------------------------------------- /_tuts/let-change-to-let-show-scoping.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index d669f405b..73cf1d848 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,9 +1,7 @@ 6 | -var aGreatNumber = 10; 7 | +let aGreatNumber = 10; 8 | 9 | if (true) { 10 | - (() => { 11 | - var aGreatNumber = 42; 12 | - })(); 13 | + let aGreatNumber = 42; 14 | } 15 | 16 | setTimeout(() => { 17 | -------------------------------------------------------------------------------- /_tuts/let-log-a-completely-undefined-var.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index 56ed5bc39..d7d9843df 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,3 +1,4 @@ 6 | +console.log(bar); 7 | let aGreatNumber = 10; 8 | 9 | if (true) { 10 | -------------------------------------------------------------------------------- /_tuts/let-log-before-a-let.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index d7d9843df..c03c18509 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,4 +1,4 @@ 6 | -console.log(bar); 7 | +console.log(aGreatNumber); 8 | let aGreatNumber = 10; 9 | 10 | if (true) { 11 | -------------------------------------------------------------------------------- /_tuts/let-playing-with-var.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index a92ea777e..e708486e8 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,5 +1,9 @@ 6 | var aGreatNumber = 10; 7 | 8 | +if (true) { 9 | + aGreatNumber = 42; 10 | +} 11 | + 12 | setTimeout(() => { 13 | console.log(aGreatNumber); 14 | }, 1000); 15 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 16 | index 84d72053c..9021a2073 100644 17 | --- a/web/assets/js/RepLogApp.js 18 | +++ b/web/assets/js/RepLogApp.js 19 | @@ -180,7 +180,6 @@ 20 | this.$wrapper.find('tbody tr').each((index, element) => { 21 | totalWeight += $(element).data('weight'); 22 | }); 23 | - console.log(totalWeight); 24 | 25 | return totalWeight; 26 | } 27 | -------------------------------------------------------------------------------- /_tuts/let-putting-second-var-in-new-function.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index 4bad8ecb1..d669f405b 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,7 +1,9 @@ 6 | var aGreatNumber = 10; 7 | 8 | if (true) { 9 | - var aGreatNumber = 42; 10 | + (() => { 11 | + var aGreatNumber = 42; 12 | + })(); 13 | } 14 | 15 | setTimeout(() => { 16 | -------------------------------------------------------------------------------- /_tuts/let-show-var-hoisting.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index c03c18509..d00062c90 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,5 +1,5 @@ 6 | console.log(aGreatNumber); 7 | -let aGreatNumber = 10; 8 | +var aGreatNumber = 10; 9 | 10 | if (true) { 11 | aGreatNumber = 42; 12 | -------------------------------------------------------------------------------- /_tuts/let-trying-it-once.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 0f93162f6..84d72053c 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -176,10 +176,11 @@ 6 | }; 7 | $.extend(Helper.prototype, { 8 | calculateTotalWeight: function() { 9 | - var totalWeight = 0; 10 | + let totalWeight = 0; 11 | this.$wrapper.find('tbody tr').each((index, element) => { 12 | totalWeight += $(element).data('weight'); 13 | }); 14 | + console.log(totalWeight); 15 | 16 | return totalWeight; 17 | } 18 | -------------------------------------------------------------------------------- /_tuts/let-using-var-multiple-times.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index e708486e8..4bad8ecb1 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,7 +1,7 @@ 6 | var aGreatNumber = 10; 7 | 8 | if (true) { 9 | - aGreatNumber = 42; 10 | + var aGreatNumber = 42; 11 | } 12 | 13 | setTimeout(() => { 14 | -------------------------------------------------------------------------------- /_tuts/let-without-another-let-same-var.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index 73cf1d848..56ed5bc39 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,7 +1,7 @@ 6 | let aGreatNumber = 10; 7 | 8 | if (true) { 9 | - let aGreatNumber = 42; 10 | + aGreatNumber = 42; 11 | } 12 | 13 | setTimeout(() => { 14 | -------------------------------------------------------------------------------- /_tuts/managing-this-changing-this-via-call.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index 43e4b3997..38939f3b8 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -82,7 +82,8 @@ 6 | this.handleRowClick 7 | ); 8 | 9 | - this.whatIsThis('hello'); 10 | + var newThis = {cat: 'meow', dog: 'woof'}; 11 | + this.whatIsThis.call(newThis, 'hello'); 12 | }, 13 | 14 | whatIsThis: function(greeting) { 15 | -------------------------------------------------------------------------------- /_tuts/managing-this-fixing-with-bind.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index 38939f3b8..ff8497367 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -83,7 +83,8 @@ 6 | ); 7 | 8 | var newThis = {cat: 'meow', dog: 'woof'}; 9 | - this.whatIsThis.call(newThis, 'hello'); 10 | + var boundWhatIsThis = this.whatIsThis.bind(this); 11 | + boundWhatIsThis.call(newThis, 'hello'); 12 | }, 13 | 14 | whatIsThis: function(greeting) { 15 | -------------------------------------------------------------------------------- /_tuts/managing-this-logging-this.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index ee34cc2a5..43e4b3997 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -81,6 +81,12 @@ 6 | 'click', 7 | this.handleRowClick 8 | ); 9 | + 10 | + this.whatIsThis('hello'); 11 | + }, 12 | + 13 | + whatIsThis: function(greeting) { 14 | + console.log(this, greeting); 15 | }, 16 | 17 | updateTotalWeightLifted: function() { 18 | -------------------------------------------------------------------------------- /_tuts/managing-this-using-self.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index 673914eeb..e3d9e90f1 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -104,13 +104,14 @@ 6 | 7 | var deleteUrl = $link.data('url'); 8 | var $row = $link.closest('tr'); 9 | + var self = this; 10 | $.ajax({ 11 | url: deleteUrl, 12 | method: 'DELETE', 13 | success: function() { 14 | $row.fadeOut('normal', function() { 15 | $(this).remove(); 16 | - RepLogApp.updateTotalWeightLifted(); 17 | + self.updateTotalWeightLifted(); 18 | }); 19 | } 20 | }); 21 | -------------------------------------------------------------------------------- /_tuts/managing-this-using-this-in-callback.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index 8de061bea..ee34cc2a5 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -108,7 +108,7 @@ 6 | method: 'DELETE', 7 | success: function() { 8 | $row.fadeOut('normal', function() { 9 | - $row.remove(); 10 | + $(this).remove(); 11 | RepLogApp.updateTotalWeightLifted(); 12 | }); 13 | } 14 | -------------------------------------------------------------------------------- /_tuts/maps-creating-an-old-hash.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index 34cfca487..547f6f022 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,4 +1,6 @@ 6 | -const favoriteFood = 'gelato'; 7 | -const iLoveFood = `The year is ${(new Date()).getFullYear()} and my favorite food is ${favoriteFood}`; 8 | +let foods = {}; 9 | +foods.italian = 'gelato'; 10 | +foods.mexican = 'tortas'; 11 | +foods.canadian = 'poutine'; 12 | 13 | -console.log(iLoveFood); 14 | +console.log(foods.italian); 15 | -------------------------------------------------------------------------------- /_tuts/maps-map-prototype-has.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index e41439b64..1bff962c8 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -3,4 +3,7 @@ foods.set('italian', 'gelato'); 6 | foods.set('mexican', 'tortas'); 7 | foods.set('canadian', 'poutine'); 8 | 9 | -console.log(foods.get('italian')); 10 | +console.log( 11 | + foods.get('italian'), 12 | + foods.has('french') 13 | +); 14 | -------------------------------------------------------------------------------- /_tuts/maps-use-a-nice-map.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index 547f6f022..e41439b64 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,6 +1,6 @@ 6 | -let foods = {}; 7 | -foods.italian = 'gelato'; 8 | -foods.mexican = 'tortas'; 9 | -foods.canadian = 'poutine'; 10 | +let foods = new Map(); 11 | +foods.set('italian', 'gelato'); 12 | +foods.set('mexican', 'tortas'); 13 | +foods.set('canadian', 'poutine'); 14 | 15 | -console.log(foods.italian); 16 | +console.log(foods.get('italian')); 17 | -------------------------------------------------------------------------------- /_tuts/maps-use-an-array-key.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index 1bff962c8..8d6919071 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -3,7 +3,10 @@ foods.set('italian', 'gelato'); 6 | foods.set('mexican', 'tortas'); 7 | foods.set('canadian', 'poutine'); 8 | 9 | +let southernUsStates = ['Tennessee', 'Kentucky', 'Texas']; 10 | +foods.set(southernUsStates, 'hot chicken'); 11 | + 12 | console.log( 13 | foods.get('italian'), 14 | - foods.has('french') 15 | + foods.get(southernUsStates) 16 | ); 17 | -------------------------------------------------------------------------------- /_tuts/maps-use-array-prorotype-size.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index 8d6919071..e0094791d 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -8,5 +8,6 @@ foods.set(southernUsStates, 'hot chicken'); 6 | 7 | console.log( 8 | foods.get('italian'), 9 | - foods.get(southernUsStates) 10 | + foods.get(southernUsStates), 11 | + foods.size 12 | ); 13 | -------------------------------------------------------------------------------- /_tuts/modules-organize-into-components.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/Components/RepLogApp.js 2 | similarity index 100% 3 | rename from web/assets/js/RepLogApp.js 4 | rename to web/assets/js/Components/RepLogApp.js 5 | diff --git a/web/assets/js/RepLogAppHelper.js b/web/assets/js/Components/RepLogAppHelper.js 6 | similarity index 100% 7 | rename from web/assets/js/RepLogAppHelper.js 8 | rename to web/assets/js/Components/RepLogAppHelper.js 9 | diff --git a/web/assets/js/rep_log.js b/web/assets/js/rep_log.js 10 | index b8460cabc..ca79a2866 100644 11 | --- a/web/assets/js/rep_log.js 12 | +++ b/web/assets/js/rep_log.js 13 | @@ -1,5 +1,5 @@ 14 | const $ = require('jquery'); 15 | -const RepLogApp = require('./RepLogApp'); 16 | +const RepLogApp = require('./Components/RepLogApp'); 17 | 18 | $(document).ready(function() { 19 | var $wrapper = $('.js-rep-log-table'); 20 | -------------------------------------------------------------------------------- /_tuts/multipage-add-layout-entry.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/base.html.twig b/app/Resources/views/base.html.twig 2 | index 7d6993ad6..6c6daac2d 100644 3 | --- a/app/Resources/views/base.html.twig 4 | +++ b/app/Resources/views/base.html.twig 5 | @@ -102,7 +102,7 @@ 6 | 7 | 8 | 9 | - 10 | + 11 | {% endblock %} 12 | 13 | 14 | diff --git a/webpack.config.js b/webpack.config.js 15 | index f009e7ecd..308c607d6 100644 16 | --- a/webpack.config.js 17 | +++ b/webpack.config.js 18 | @@ -4,6 +4,7 @@ module.exports = { 19 | entry: { 20 | rep_log: './web/assets/js/rep_log.js', 21 | login: './web/assets/js/login.js', 22 | + layout: './web/assets/js/layout.js', 23 | }, 24 | output: { 25 | path: path.resolve(__dirname, 'web', 'build'), 26 | -------------------------------------------------------------------------------- /_tuts/multipage-multiple-entries.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/FOSUserBundle/views/Security/login.html.twig b/app/Resources/FOSUserBundle/views/Security/login.html.twig 2 | index e79438bce..1e2ce3ca5 100644 3 | --- a/app/Resources/FOSUserBundle/views/Security/login.html.twig 4 | +++ b/app/Resources/FOSUserBundle/views/Security/login.html.twig 5 | @@ -11,7 +11,7 @@ 6 | {% block javascripts %} 7 | {{ parent() }} 8 | 9 | - 10 | + 11 | {% endblock %} 12 | 13 | {% block fos_user_content %} 14 | diff --git a/webpack.config.js b/webpack.config.js 15 | index 2f389cc1c..f009e7ecd 100644 16 | --- a/webpack.config.js 17 | +++ b/webpack.config.js 18 | @@ -1,9 +1,12 @@ 19 | const path = require('path'); 20 | 21 | module.exports = { 22 | - entry: './web/assets/js/rep_log.js', 23 | + entry: { 24 | + rep_log: './web/assets/js/rep_log.js', 25 | + login: './web/assets/js/login.js', 26 | + }, 27 | output: { 28 | path: path.resolve(__dirname, 'web', 'build'), 29 | - filename: 'rep_log.js', 30 | + filename: '[name].js', 31 | } 32 | }; 33 | -------------------------------------------------------------------------------- /_tuts/new-form-simple-ajax-submit.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 723ec8f26..75bcfc0bd 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -58,7 +58,13 @@ 6 | 7 | handleNewFormSubmit: function(e) { 8 | e.preventDefault(); 9 | - console.log('submitting!'); 10 | + 11 | + var $form = $(e.currentTarget); 12 | + $.ajax({ 13 | + url: $form.attr('action'), 14 | + method: 'POST', 15 | + data: $form.serialize() 16 | + }); 17 | } 18 | }); 19 | 20 | -------------------------------------------------------------------------------- /_tuts/new-form-updating-total.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 4265be89b..4cfed016e 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -61,12 +61,14 @@ 6 | 7 | var $form = $(e.currentTarget); 8 | var $tbody = this.$wrapper.find('tbody'); 9 | + var self = this; 10 | $.ajax({ 11 | url: $form.attr('action'), 12 | method: 'POST', 13 | data: $form.serialize(), 14 | success: function(data) { 15 | $tbody.append(data); 16 | + self.updateTotalWeightLifted(); 17 | }, 18 | error: function(jqXHR) { 19 | $form.closest('.js-new-rep-log-form-wrapper') 20 | -------------------------------------------------------------------------------- /_tuts/node-first-node-play-script.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | new file mode 100644 3 | index 000000000..b991ba987 4 | --- /dev/null 5 | +++ b/play.js 6 | @@ -0,0 +1 @@ 7 | +console.log('OMG! Node is JS on the server!'); 8 | -------------------------------------------------------------------------------- /_tuts/node-playing-with-arrow-functions.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index b991ba987..a92ea777e 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1 +1,7 @@ 6 | -console.log('OMG! Node is JS on the server!'); 7 | +var aGreatNumber = 10; 8 | + 9 | +setTimeout(() => { 10 | + console.log(aGreatNumber); 11 | +}, 1000); 12 | + 13 | +console.log('waiting...'); 14 | -------------------------------------------------------------------------------- /_tuts/npm-add-use-jquery.diff: -------------------------------------------------------------------------------- 1 | diff --git a/package.json b/package.json 2 | index 8887a04f2..6f4afd977 100644 3 | --- a/package.json 4 | +++ b/package.json 5 | @@ -6,6 +6,7 @@ 6 | "author": "Ryan Weaver ", 7 | "license": "MIT", 8 | "devDependencies": { 9 | + "jquery": "^3.2.1", 10 | "webpack": "^3.4.1" 11 | } 12 | } 13 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 14 | index 68380f529..79f74ae84 100644 15 | --- a/web/assets/js/RepLogApp.js 16 | +++ b/web/assets/js/RepLogApp.js 17 | @@ -1,8 +1,9 @@ 18 | 'use strict'; 19 | 20 | const Helper = require('./RepLogAppHelper'); 21 | +const $ = require('jquery'); 22 | 23 | -(function(window, $, Routing, swal) { 24 | +(function(window, Routing, swal) { 25 | 26 | let HelperInstances = new WeakMap(); 27 | 28 | @@ -213,4 +214,4 @@ const Helper = require('./RepLogAppHelper'); 29 | `; 30 | 31 | window.RepLogApp = RepLogApp; 32 | -})(window, jQuery, Routing, swal); 33 | +})(window, Routing, swal); 34 | diff --git a/yarn.lock b/yarn.lock 35 | index 882dfb5ff..3efe86db2 100644 36 | --- a/yarn.lock 37 | +++ b/yarn.lock 38 | @@ -973,6 +973,10 @@ isstream@~0.1.2: 39 | version "0.1.2" 40 | resolved "https://registry.yarnpkg.com/isstream/-/isstream-0.1.2.tgz#47e63f7af55afa6f92e1500e690eb8b8529c099a" 41 | 42 | +jquery@^3.2.1: 43 | + version "3.2.1" 44 | + resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.2.1.tgz#5c4d9de652af6cd0a770154a631bba12b015c787" 45 | + 46 | jsbn@~0.1.0: 47 | version "0.1.1" 48 | resolved "https://registry.yarnpkg.com/jsbn/-/jsbn-0.1.1.tgz#a5e654c2e5a2deb5f201d96cefbca80c0ef2f513" 49 | -------------------------------------------------------------------------------- /_tuts/object-literals-show-data-data.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 5637614fe..99d81783e 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -106,8 +106,10 @@ 6 | 7 | _saveRepLog: function(data) { 8 | return new Promise((resolve, reject) => { 9 | + const url = Routing.generate('rep_log_new'); 10 | + 11 | $.ajax({ 12 | - url: Routing.generate('rep_log_new'), 13 | + url: url, 14 | method: 'POST', 15 | data: JSON.stringify(data) 16 | }).then((data, textStatus, jqXHR) => { 17 | -------------------------------------------------------------------------------- /_tuts/object-literals-use-value-as-key-val.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 99d81783e..d1efd6f38 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -109,7 +109,7 @@ 6 | const url = Routing.generate('rep_log_new'); 7 | 8 | $.ajax({ 9 | - url: url, 10 | + url, 11 | method: 'POST', 12 | data: JSON.stringify(data) 13 | }).then((data, textStatus, jqXHR) => { 14 | -------------------------------------------------------------------------------- /_tuts/production-add-defineplugin.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | index 9f11919da..b98e8c7c9 100644 3 | --- a/webpack.config.js 4 | +++ b/webpack.config.js 5 | @@ -147,6 +147,12 @@ if (isProduction) { 6 | debug: false 7 | }) 8 | ); 9 | + 10 | + webpackConfig.plugins.push( 11 | + new webpack.DefinePlugin({ 12 | + 'process.env.NODE_ENV': JSON.stringify('production') 13 | + }) 14 | + ); 15 | } 16 | 17 | -module.exports = webpackConfig; 18 | \ No newline at end of file 19 | +module.exports = webpackConfig; 20 | -------------------------------------------------------------------------------- /_tuts/production-add-loaderoptionsplugin.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | index de9d50da7..f19249e62 100644 3 | --- a/webpack.config.js 4 | +++ b/webpack.config.js 5 | @@ -135,6 +135,15 @@ if (process.env.NODE_ENV === 'production') { 6 | webpackConfig.plugins.push( 7 | new webpack.optimize.UglifyJsPlugin() 8 | ); 9 | + 10 | + // passes these options to all loaders 11 | + // but we should really pass these ourselves 12 | + webpackConfig.plugins.push( 13 | + new webpack.LoaderOptionsPlugin({ 14 | + minimize: true, 15 | + debug: false 16 | + }) 17 | + ); 18 | } 19 | 20 | module.exports = webpackConfig; 21 | \ No newline at end of file 22 | -------------------------------------------------------------------------------- /_tuts/production-adding-scripts-to-package-json.diff: -------------------------------------------------------------------------------- 1 | diff --git a/package.json b/package.json 2 | index 2f781c385..f29df9bd2 100644 3 | --- a/package.json 4 | +++ b/package.json 5 | @@ -5,6 +5,11 @@ 6 | "repository": "git@github.com:knpuniversity/javascript.git", 7 | "author": "Ryan Weaver ", 8 | "license": "MIT", 9 | + "scripts": { 10 | + "dev": "NODE_ENV=dev webpack", 11 | + "watch": "NODE_ENV=dev webpack --watch", 12 | + "production": "NODE_ENV=production webpack" 13 | + }, 14 | "devDependencies": { 15 | "babel-core": "^6.25.0", 16 | "babel-loader": "^7.1.1", 17 | -------------------------------------------------------------------------------- /_tuts/production-conditionally-add-uglify.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | index 525f14d7b..de9d50da7 100644 3 | --- a/webpack.config.js 4 | +++ b/webpack.config.js 5 | @@ -6,8 +6,6 @@ const ExtractTextPlugin = require('extract-text-webpack-plugin'); 6 | const useDevServer = false; 7 | const publicPath = useDevServer ? 'http://localhost:8080/build/' : '/build/'; 8 | 9 | -console.log(process.env.NODE_ENV); 10 | - 11 | const styleLoader = { 12 | loader: 'style-loader', 13 | options: { 14 | @@ -33,7 +31,7 @@ const resolveUrlLoader = { 15 | } 16 | }; 17 | 18 | -module.exports = { 19 | +const webpackConfig = { 20 | entry: { 21 | rep_log: './assets/js/rep_log.js', 22 | login: './assets/js/login.js', 23 | @@ -132,3 +130,11 @@ module.exports = { 24 | headers: { 'Access-Control-Allow-Origin': '*' }, 25 | } 26 | }; 27 | + 28 | +if (process.env.NODE_ENV === 'production') { 29 | + webpackConfig.plugins.push( 30 | + new webpack.optimize.UglifyJsPlugin() 31 | + ); 32 | +} 33 | + 34 | +module.exports = webpackConfig; 35 | \ No newline at end of file 36 | -------------------------------------------------------------------------------- /_tuts/production-disable-sourcemaps.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | index f19249e62..86d8731c4 100644 3 | --- a/webpack.config.js 4 | +++ b/webpack.config.js 5 | @@ -5,17 +5,19 @@ const ExtractTextPlugin = require('extract-text-webpack-plugin'); 6 | 7 | const useDevServer = false; 8 | const publicPath = useDevServer ? 'http://localhost:8080/build/' : '/build/'; 9 | +const isProduction = process.env.NODE_ENV === 'production'; 10 | +const useSourcemaps = !isProduction; 11 | 12 | const styleLoader = { 13 | loader: 'style-loader', 14 | options: { 15 | - sourceMap: true 16 | + sourceMap: useSourcemaps 17 | } 18 | }; 19 | const cssLoader = { 20 | loader: 'css-loader', 21 | options: { 22 | - sourceMap: true 23 | + sourceMap: useSourcemaps 24 | } 25 | }; 26 | const sassLoader = { 27 | @@ -27,7 +29,7 @@ const sassLoader = { 28 | const resolveUrlLoader = { 29 | loader: 'resolve-url-loader', 30 | options: { 31 | - sourceMap: true 32 | + sourceMap: useSourcemaps 33 | } 34 | }; 35 | 36 | @@ -124,14 +126,14 @@ const webpackConfig = { 37 | 38 | new ExtractTextPlugin('[name].css'), 39 | ], 40 | - devtool: 'inline-source-map', 41 | + devtool: useSourcemaps ? 'inline-source-map' : false, 42 | devServer: { 43 | contentBase: './web', 44 | headers: { 'Access-Control-Allow-Origin': '*' }, 45 | } 46 | }; 47 | 48 | -if (process.env.NODE_ENV === 'production') { 49 | +if (isProduction) { 50 | webpackConfig.plugins.push( 51 | new webpack.optimize.UglifyJsPlugin() 52 | ); 53 | -------------------------------------------------------------------------------- /_tuts/production-pass-minimize-directly-to-css-loader.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | index 86d8731c4..9f11919da 100644 3 | --- a/webpack.config.js 4 | +++ b/webpack.config.js 5 | @@ -17,7 +17,8 @@ const styleLoader = { 6 | const cssLoader = { 7 | loader: 'css-loader', 8 | options: { 9 | - sourceMap: useSourcemaps 10 | + sourceMap: useSourcemaps, 11 | + minimize: true 12 | } 13 | }; 14 | const sassLoader = { 15 | -------------------------------------------------------------------------------- /_tuts/production-set-print-node-env.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | index cf26af277..525f14d7b 100644 3 | --- a/webpack.config.js 4 | +++ b/webpack.config.js 5 | @@ -6,6 +6,8 @@ const ExtractTextPlugin = require('extract-text-webpack-plugin'); 6 | const useDevServer = false; 7 | const publicPath = useDevServer ? 'http://localhost:8080/build/' : '/build/'; 8 | 9 | +console.log(process.env.NODE_ENV); 10 | + 11 | const styleLoader = { 12 | loader: 'style-loader', 13 | options: { 14 | -------------------------------------------------------------------------------- /_tuts/promises-ajax-to-fetch-one-replog.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 8029144eb..febb2f23a 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -100,7 +100,12 @@ 6 | method: 'POST', 7 | data: JSON.stringify(data) 8 | }).then(function(data, textStatus, jqXHR) { 9 | - console.log(jqXHR.getResponseHeader('Location')); 10 | + $.ajax({ 11 | + url: jqXHR.getResponseHeader('Location') 12 | + }).then(function(data) { 13 | + console.log('now we are REALLY done'); 14 | + console.log(data); 15 | + }); 16 | }); 17 | }, 18 | 19 | -------------------------------------------------------------------------------- /_tuts/promises-changing-to-then.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index c990f8b77..b82450303 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -98,10 +98,10 @@ 6 | var errorData = JSON.parse(jqXHR.responseText); 7 | self._mapErrorsToForm(errorData.errors); 8 | } 9 | - }).done(function(data) { 10 | + }).then(function(data) { 11 | console.log('I am successful!'); 12 | console.log(data); 13 | - }).done(function(data) { 14 | + }).then(function(data) { 15 | console.log('another handler!'); 16 | console.log(data); 17 | }) 18 | -------------------------------------------------------------------------------- /_tuts/promises-checking-error-instanceof.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index b1584c9f6..7006d854f 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -89,7 +89,9 @@ 6 | self._clearForm(); 7 | self._addRow(data); 8 | }).catch(function(jqXHR) { 9 | - console.log(jqXHR); 10 | + if (jqXHR instanceof ReferenceError) { 11 | + console.log('wow!'); 12 | + } 13 | var errorData = JSON.parse(jqXHR.responseText); 14 | self._mapErrorsToForm(errorData.errors); 15 | }); 16 | -------------------------------------------------------------------------------- /_tuts/promises-logging-data-throw-arg.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 04e736cda..b1584c9f6 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -89,6 +89,7 @@ 6 | self._clearForm(); 7 | self._addRow(data); 8 | }).catch(function(jqXHR) { 9 | + console.log(jqXHR); 10 | var errorData = JSON.parse(jqXHR.responseText); 11 | self._mapErrorsToForm(errorData.errors); 12 | }); 13 | -------------------------------------------------------------------------------- /_tuts/promises-massage-reject-value.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 9931e060e..fcfb320c2 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -88,8 +88,7 @@ 6 | .then(function(data) { 7 | self._clearForm(); 8 | self._addRow(data); 9 | - }).catch(function(jqXHR) { 10 | - var errorData = JSON.parse(jqXHR.responseText); 11 | + }).catch(function(errorData) { 12 | self._mapErrorsToForm(errorData.errors); 13 | }); 14 | }, 15 | @@ -108,7 +107,9 @@ 16 | resolve(data); 17 | }); 18 | }).catch(function(jqXHR) { 19 | - reject(jqXHR); 20 | + var errorData = JSON.parse(jqXHR.responseText); 21 | + 22 | + reject(errorData); 23 | }); 24 | }); 25 | }, 26 | -------------------------------------------------------------------------------- /_tuts/promises-preconfirm-with-real-promise.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index aaf29f215..1f49938d5 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -55,7 +55,15 @@ 6 | swal({ 7 | title: 'Delete this log?', 8 | text: 'What? Did you not actually lift this?', 9 | - showCancelButton: true 10 | + showCancelButton: true, 11 | + showLoaderOnConfirm: true, 12 | + preConfirm: function() { 13 | + return new Promise(function(resolve, reject) { 14 | + setTimeout(function() { 15 | + resolve(); 16 | + }, 1000); 17 | + }); 18 | + } 19 | }).then(function () { 20 | self._deleteRepLog($link); 21 | }).catch(function(arg) { 22 | -------------------------------------------------------------------------------- /_tuts/promises-print-location-header-after-create.diff: -------------------------------------------------------------------------------- 1 | diff --git a/src/AppBundle/Controller/RepLogController.php b/src/AppBundle/Controller/RepLogController.php 2 | index f93e19f47..76b2bd13c 100644 3 | --- a/src/AppBundle/Controller/RepLogController.php 4 | +++ b/src/AppBundle/Controller/RepLogController.php 5 | @@ -84,7 +84,8 @@ class RepLogController extends BaseController 6 | 7 | $apiModel = $this->createRepLogApiModel($repLog); 8 | 9 | - $response = $this->createApiResponse($apiModel); 10 | + //$response = $this->createApiResponse($apiModel); 11 | + $response = new Response(null, 204); 12 | // setting the Location header... it's a best-practice 13 | $response->headers->set( 14 | 'Location', 15 | -------------------------------------------------------------------------------- /_tuts/promises-printing-location-header.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 8b1323d57..8029144eb 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -89,13 +89,8 @@ 6 | self._clearForm(); 7 | self._addRow(data); 8 | }).catch(function(jqXHR) { 9 | - if (typeof jqXHR.responseText === 'undefined') { 10 | - throw jqXHR; 11 | - } 12 | var errorData = JSON.parse(jqXHR.responseText); 13 | self._mapErrorsToForm(errorData.errors); 14 | - }).catch(function(e) { 15 | - console.log(e); 16 | }); 17 | }, 18 | 19 | @@ -104,6 +99,8 @@ 20 | url: Routing.generate('rep_log_new'), 21 | method: 'POST', 22 | data: JSON.stringify(data) 23 | + }).then(function(data, textStatus, jqXHR) { 24 | + console.log(jqXHR.getResponseHeader('Location')); 25 | }); 26 | }, 27 | 28 | -------------------------------------------------------------------------------- /_tuts/promises-putting-then-all-first.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 745851544..34e5a0572 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -103,13 +103,13 @@ 6 | console.log(data); 7 | 8 | return data; 9 | - }).catch(function(jqXHR) { 10 | - console.log('failed!'); 11 | - console.log(jqXHR.responseText); 12 | }).then(function(data) { 13 | console.log('another handler!'); 14 | console.log(data); 15 | - }) 16 | + }).catch(function(jqXHR) { 17 | + console.log('failed!'); 18 | + console.log(jqXHR.responseText); 19 | + }); 20 | }, 21 | 22 | _mapErrorsToForm: function(errorData) { 23 | -------------------------------------------------------------------------------- /_tuts/promises-re-throw-and-2nd-catch.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 7006d854f..8b1323d57 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -89,11 +89,13 @@ 6 | self._clearForm(); 7 | self._addRow(data); 8 | }).catch(function(jqXHR) { 9 | - if (jqXHR instanceof ReferenceError) { 10 | - console.log('wow!'); 11 | + if (typeof jqXHR.responseText === 'undefined') { 12 | + throw jqXHR; 13 | } 14 | var errorData = JSON.parse(jqXHR.responseText); 15 | self._mapErrorsToForm(errorData.errors); 16 | + }).catch(function(e) { 17 | + console.log(e); 18 | }); 19 | }, 20 | 21 | -------------------------------------------------------------------------------- /_tuts/promises-reject.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 58cbfe6f7..9931e060e 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -107,6 +107,8 @@ 6 | // we're finally done! 7 | resolve(data); 8 | }); 9 | + }).catch(function(jqXHR) { 10 | + reject(jqXHR); 11 | }); 12 | }); 13 | }, 14 | -------------------------------------------------------------------------------- /_tuts/promises-returning-in-then.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index b82450303..b2478c34f 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -101,6 +101,8 @@ 6 | }).then(function(data) { 7 | console.log('I am successful!'); 8 | console.log(data); 9 | + 10 | + return data; 11 | }).then(function(data) { 12 | console.log('another handler!'); 13 | console.log(data); 14 | -------------------------------------------------------------------------------- /_tuts/promises-using-catch-instead.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 24568bb79..745851544 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -103,7 +103,7 @@ 6 | console.log(data); 7 | 8 | return data; 9 | - }, function(jqXHR) { 10 | + }).catch(function(jqXHR) { 11 | console.log('failed!'); 12 | console.log(jqXHR.responseText); 13 | }).then(function(data) { 14 | -------------------------------------------------------------------------------- /_tuts/promises-using-catch.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 3039c3bc1..aaf29f215 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -56,15 +56,11 @@ 6 | title: 'Delete this log?', 7 | text: 'What? Did you not actually lift this?', 8 | showCancelButton: true 9 | - }).then( 10 | - function () { 11 | - self._deleteRepLog($link); 12 | - }, 13 | - function () { 14 | - console.log('canceled'); 15 | - } 16 | - ); 17 | - 18 | + }).then(function () { 19 | + self._deleteRepLog($link); 20 | + }).catch(function(arg) { 21 | + console.log('canceled', arg); 22 | + }); 23 | }, 24 | 25 | _deleteRepLog: function($link) { 26 | -------------------------------------------------------------------------------- /_tuts/promises-using-deletereplog-in-preconfirm.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 1f49938d5..05e48d474 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -58,16 +58,10 @@ 6 | showCancelButton: true, 7 | showLoaderOnConfirm: true, 8 | preConfirm: function() { 9 | - return new Promise(function(resolve, reject) { 10 | - setTimeout(function() { 11 | - resolve(); 12 | - }, 1000); 13 | - }); 14 | + return self._deleteRepLog($link); 15 | } 16 | - }).then(function () { 17 | - self._deleteRepLog($link); 18 | }).catch(function(arg) { 19 | - console.log('canceled', arg); 20 | + // canceling is cool! 21 | }); 22 | }, 23 | 24 | @@ -81,7 +75,8 @@ 25 | var deleteUrl = $link.data('url'); 26 | var $row = $link.closest('tr'); 27 | var self = this; 28 | - $.ajax({ 29 | + 30 | + return $.ajax({ 31 | url: deleteUrl, 32 | method: 'DELETE' 33 | }).then(function() { 34 | -------------------------------------------------------------------------------- /_tuts/promises-using-done-as-an-example.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index f3dfc7bb4..c990f8b77 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -98,7 +98,13 @@ 6 | var errorData = JSON.parse(jqXHR.responseText); 7 | self._mapErrorsToForm(errorData.errors); 8 | } 9 | - }); 10 | + }).done(function(data) { 11 | + console.log('I am successful!'); 12 | + console.log(data); 13 | + }).done(function(data) { 14 | + console.log('another handler!'); 15 | + console.log(data); 16 | + }) 17 | }, 18 | 19 | _mapErrorsToForm: function(errorData) { 20 | -------------------------------------------------------------------------------- /_tuts/promises-using-rejected-2nd-then-arg.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index b2478c34f..24568bb79 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -103,6 +103,9 @@ 6 | console.log(data); 7 | 8 | return data; 9 | + }, function(jqXHR) { 10 | + console.log('failed!'); 11 | + console.log(jqXHR.responseText); 12 | }).then(function(data) { 13 | console.log('another handler!'); 14 | console.log(data); 15 | -------------------------------------------------------------------------------- /_tuts/real-object-create-2-instances.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index d622ae575..e55d9637f 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -5,10 +5,10 @@ 6 | initialize: function ($wrapper) { 7 | this.$wrapper = $wrapper; 8 | this.helper = new Helper(this.$wrapper); 9 | + var helper2 = new Helper($('footer')); 10 | console.log( 11 | - 'foo'.__proto__, 12 | - [].__proto__, 13 | - (new Date()).__proto__ 14 | + this.helper.calculateTotalWeight(), 15 | + helper2.calculateTotalWeight() 16 | ); 17 | 18 | this.$wrapper.find('.js-delete-rep-log').on( 19 | -------------------------------------------------------------------------------- /_tuts/real-object-create-the-object-no-prototype.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index af7dcf79a..85c6f37f2 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -4,7 +4,7 @@ 6 | window.RepLogApp = { 7 | initialize: function ($wrapper) { 8 | this.$wrapper = $wrapper; 9 | - Helper.initialize(this.$wrapper); 10 | + this.helper = new Helper(this.$wrapper); 11 | 12 | this.$wrapper.find('.js-delete-rep-log').on( 13 | 'click', 14 | @@ -17,7 +17,7 @@ 15 | }, 16 | updateTotalWeightLifted: function () { 17 | this.$wrapper.find('.js-total-weight').html( 18 | - Helper.calculateTotalWeight() 19 | + this.helper.calculateTotalWeight() 20 | ); 21 | }, 22 | 23 | @@ -55,9 +55,7 @@ 24 | /** 25 | * A "private" object 26 | */ 27 | - var Helper = {}; 28 | - 29 | - Helper.initialize = function ($wrapper) { 30 | + var Helper = function ($wrapper) { 31 | this.$wrapper = $wrapper; 32 | }; 33 | Helper.calculateTotalWeight = function() { 34 | -------------------------------------------------------------------------------- /_tuts/real-object-playing-with-proto.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 213b6a7ea..1921530ed 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -9,6 +9,12 @@ 6 | console.log(Helper, Object.keys(Helper)); 7 | console.log(this.helper.calculateTotalWeight()); 8 | 9 | + var playObject = { 10 | + lift: 'stuff' 11 | + }; 12 | + playObject.__proto__.cat = 'meow'; 13 | + console.log(playObject.lift, playObject.cat); 14 | + 15 | this.$wrapper.find('.js-delete-rep-log').on( 16 | 'click', 17 | this.handleRepLogDelete.bind(this) 18 | -------------------------------------------------------------------------------- /_tuts/real-object-printing-object-vs-instance.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 85c6f37f2..e2c73b4d6 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -5,6 +5,8 @@ 6 | initialize: function ($wrapper) { 7 | this.$wrapper = $wrapper; 8 | this.helper = new Helper(this.$wrapper); 9 | + console.log(this.helper, Object.keys(this.helper)); 10 | + console.log(Helper, Object.keys(Helper)); 11 | 12 | this.$wrapper.find('.js-delete-rep-log').on( 13 | 'click', 14 | -------------------------------------------------------------------------------- /_tuts/real-object-refactor-helper-syntax.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 5afe38ced..af7dcf79a 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -55,18 +55,18 @@ 6 | /** 7 | * A "private" object 8 | */ 9 | - var Helper = { 10 | - initialize: function ($wrapper) { 11 | - this.$wrapper = $wrapper; 12 | - }, 13 | + var Helper = {}; 14 | 15 | - calculateTotalWeight: function() { 16 | - var totalWeight = 0; 17 | - this.$wrapper.find('tbody tr').each(function () { 18 | - totalWeight += $(this).data('weight'); 19 | - }); 20 | + Helper.initialize = function ($wrapper) { 21 | + this.$wrapper = $wrapper; 22 | + }; 23 | + Helper.calculateTotalWeight = function() { 24 | + var totalWeight = 0; 25 | + this.$wrapper.find('tbody tr').each(function () { 26 | + totalWeight += $(this).data('weight'); 27 | + }); 28 | 29 | - return totalWeight; 30 | - } 31 | + return totalWeight; 32 | }; 33 | + 34 | })(window, jQuery); 35 | -------------------------------------------------------------------------------- /_tuts/real-object-remove-debug-code.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index e55d9637f..cd866a17f 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -5,11 +5,6 @@ 6 | initialize: function ($wrapper) { 7 | this.$wrapper = $wrapper; 8 | this.helper = new Helper(this.$wrapper); 9 | - var helper2 = new Helper($('footer')); 10 | - console.log( 11 | - this.helper.calculateTotalWeight(), 12 | - helper2.calculateTotalWeight() 13 | - ); 14 | 15 | this.$wrapper.find('.js-delete-rep-log').on( 16 | 'click', 17 | -------------------------------------------------------------------------------- /_tuts/real-object-string-array-proto.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 1921530ed..d622ae575 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -5,15 +5,11 @@ 6 | initialize: function ($wrapper) { 7 | this.$wrapper = $wrapper; 8 | this.helper = new Helper(this.$wrapper); 9 | - console.log(this.helper, Object.keys(this.helper)); 10 | - console.log(Helper, Object.keys(Helper)); 11 | - console.log(this.helper.calculateTotalWeight()); 12 | - 13 | - var playObject = { 14 | - lift: 'stuff' 15 | - }; 16 | - playObject.__proto__.cat = 'meow'; 17 | - console.log(playObject.lift, playObject.cat); 18 | + console.log( 19 | + 'foo'.__proto__, 20 | + [].__proto__, 21 | + (new Date()).__proto__ 22 | + ); 23 | 24 | this.$wrapper.find('.js-delete-rep-log').on( 25 | 'click', 26 | -------------------------------------------------------------------------------- /_tuts/real-object-use-extend.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index cd866a17f..52104b80d 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -58,13 +58,15 @@ 6 | var Helper = function ($wrapper) { 7 | this.$wrapper = $wrapper; 8 | }; 9 | - Helper.prototype.calculateTotalWeight = function() { 10 | - var totalWeight = 0; 11 | - this.$wrapper.find('tbody tr').each(function () { 12 | - totalWeight += $(this).data('weight'); 13 | - }); 14 | + $.extend(Helper.prototype, { 15 | + calculateTotalWeight: function() { 16 | + var totalWeight = 0; 17 | + this.$wrapper.find('tbody tr').each(function () { 18 | + totalWeight += $(this).data('weight'); 19 | + }); 20 | 21 | - return totalWeight; 22 | - }; 23 | + return totalWeight; 24 | + } 25 | + }); 26 | 27 | })(window, jQuery); 28 | -------------------------------------------------------------------------------- /_tuts/real-object-use-prototype.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index e2c73b4d6..213b6a7ea 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -7,6 +7,7 @@ 6 | this.helper = new Helper(this.$wrapper); 7 | console.log(this.helper, Object.keys(this.helper)); 8 | console.log(Helper, Object.keys(Helper)); 9 | + console.log(this.helper.calculateTotalWeight()); 10 | 11 | this.$wrapper.find('.js-delete-rep-log').on( 12 | 'click', 13 | @@ -60,7 +61,7 @@ 14 | var Helper = function ($wrapper) { 15 | this.$wrapper = $wrapper; 16 | }; 17 | - Helper.calculateTotalWeight = function() { 18 | + Helper.prototype.calculateTotalWeight = function() { 19 | var totalWeight = 0; 20 | this.$wrapper.find('tbody tr').each(function () { 21 | totalWeight += $(this).data('weight'); 22 | -------------------------------------------------------------------------------- /_tuts/require-using-require-in-node.diff: -------------------------------------------------------------------------------- 1 | diff --git a/foods.js b/foods.js 2 | new file mode 100644 3 | index 000000000..2d7ef38bc 4 | --- /dev/null 5 | +++ b/foods.js 6 | @@ -0,0 +1,6 @@ 7 | +let foods = new Set(); 8 | +foods.add('gelato'); 9 | +foods.add('tortas'); 10 | +foods.add('gelato'); 11 | + 12 | +module.exports = foods; 13 | diff --git a/play.js b/play.js 14 | index c97b3b728..bc106008b 100644 15 | --- a/play.js 16 | +++ b/play.js 17 | @@ -1,6 +1,3 @@ 18 | -let foods = new Set(); 19 | -foods.add('gelato'); 20 | -foods.add('tortas'); 21 | -foods.add('gelato'); 22 | +const foods = require('./foods'); 23 | 24 | console.log(foods); 25 | -------------------------------------------------------------------------------- /_tuts/sass-set-a-bootstrap-variable.diff: -------------------------------------------------------------------------------- 1 | diff --git a/assets/css/main.scss b/assets/css/main.scss 2 | index 21794eec7..dce24798f 100644 3 | --- a/assets/css/main.scss 4 | +++ b/assets/css/main.scss 5 | @@ -1,3 +1,5 @@ 6 | +$brand-primary: darken(#428bca, 2.5%); // #3885c7 7 | + 8 | @import '~bootstrap-sass/assets/stylesheets/_bootstrap.scss'; 9 | @import '~font-awesome/css/font-awesome.css'; 10 | 11 | -------------------------------------------------------------------------------- /_tuts/sass-try-using-scss-file.diff: -------------------------------------------------------------------------------- 1 | diff --git a/assets/css/main.css b/assets/css/main.scss 2 | similarity index 91% 3 | rename from assets/css/main.css 4 | rename to assets/css/main.scss 5 | index c1c072b18..977dd9959 100644 6 | --- a/assets/css/main.css 7 | +++ b/assets/css/main.scss 8 | @@ -24,12 +24,11 @@ footer.footer { 9 | padding: 14px 0; 10 | text-transform: uppercase; 11 | border-color: #59B2E6; 12 | -} 13 | -.btn-login:hover, 14 | -.btn-login:focus { 15 | - color: #fff; 16 | - background-color: #53A3CD; 17 | - border-color: #53A3CD; 18 | + &:hover,&:focus { 19 | + color: #fff; 20 | + background-color: #53A3CD; 21 | + border-color: #53A3CD; 22 | + } 23 | } 24 | 25 | /*INDEX*/ 26 | diff --git a/assets/js/layout.js b/assets/js/layout.js 27 | index 83bb08c92..9817410bc 100644 28 | --- a/assets/js/layout.js 29 | +++ b/assets/js/layout.js 30 | @@ -7,7 +7,7 @@ require('babel-polyfill'); 31 | 32 | require('bootstrap/dist/css/bootstrap.css'); 33 | require('font-awesome/css/font-awesome.css'); 34 | -require('../css/main.css'); 35 | +require('../css/main.scss'); 36 | 37 | $(document).ready(function() { 38 | $('[data-toggle="tooltip"]').tooltip(); 39 | -------------------------------------------------------------------------------- /_tuts/sass-use-import-for-vendor-sass.diff: -------------------------------------------------------------------------------- 1 | diff --git a/assets/css/main.scss b/assets/css/main.scss 2 | index 977dd9959..21794eec7 100644 3 | --- a/assets/css/main.scss 4 | +++ b/assets/css/main.scss 5 | @@ -1,3 +1,6 @@ 6 | +@import '~bootstrap-sass/assets/stylesheets/_bootstrap.scss'; 7 | +@import '~font-awesome/css/font-awesome.css'; 8 | + 9 | .main-content { 10 | margin-top: 80px; 11 | } 12 | diff --git a/assets/js/layout.js b/assets/js/layout.js 13 | index 997dc3d82..d0cd11180 100644 14 | --- a/assets/js/layout.js 15 | +++ b/assets/js/layout.js 16 | @@ -4,9 +4,6 @@ const $ = require('jquery'); 17 | require('bootstrap-sass'); 18 | // make sure the polyfill library is loaded in this main entry 19 | require('babel-polyfill'); 20 | - 21 | -require('bootstrap-sass/assets/stylesheets/_bootstrap.scss'); 22 | -require('font-awesome/css/font-awesome.css'); 23 | require('../css/main.scss'); 24 | 25 | $(document).ready(function() { 26 | -------------------------------------------------------------------------------- /_tuts/set-create-array-of-foods.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index 96c132c8b..d99562cd6 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,14 +1,6 @@ 6 | -let foods = new WeakMap(); 7 | -foods.set(['italian'], 'gelato'); 8 | -foods.set(['mexican'], 'tortas'); 9 | -foods.set(['canadian'], 'poutine'); 10 | +let foods = []; 11 | +foods.push('gelato'); 12 | +foods.push('tortas'); 13 | +foods.push('gelato'); 14 | 15 | -let southernUsStates = ['Tennessee', 'Kentucky', 'Texas']; 16 | -foods.set(southernUsStates, 'hot chicken'); 17 | -southernUsStates = null; 18 | - 19 | -console.log( 20 | - foods.get(['italian']), 21 | - foods.get(southernUsStates), 22 | - foods.size 23 | -); 24 | +console.log(foods); 25 | -------------------------------------------------------------------------------- /_tuts/set-use-set-items-are-unique.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index d99562cd6..c97b3b728 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,6 +1,6 @@ 6 | -let foods = []; 7 | -foods.push('gelato'); 8 | -foods.push('tortas'); 9 | -foods.push('gelato'); 10 | +let foods = new Set(); 11 | +foods.add('gelato'); 12 | +foods.add('tortas'); 13 | +foods.add('gelato'); 14 | 15 | console.log(foods); 16 | -------------------------------------------------------------------------------- /_tuts/sourcemaps-add-devtool-for-js.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | index f9358b503..cd764201c 100644 3 | --- a/webpack.config.js 4 | +++ b/webpack.config.js 5 | @@ -95,5 +95,6 @@ module.exports = { 6 | // copies to {output}/static 7 | { from: './assets/static', to: 'static' } 8 | ]), 9 | - ] 10 | + ], 11 | + devtool: 'inline-source-map' 12 | }; 13 | -------------------------------------------------------------------------------- /_tuts/sourcemaps-add-for-css-sass.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | index cd764201c..f539b4e63 100644 3 | --- a/webpack.config.js 4 | +++ b/webpack.config.js 5 | @@ -4,11 +4,15 @@ const CopyWebpackPlugin = require('copy-webpack-plugin'); 6 | 7 | const styleLoader = { 8 | loader: 'style-loader', 9 | - options: {} 10 | + options: { 11 | + sourceMap: true 12 | + } 13 | }; 14 | const cssLoader = { 15 | loader: 'css-loader', 16 | - options: {} 17 | + options: { 18 | + sourceMap: true 19 | + } 20 | }; 21 | const sassLoader = { 22 | loader: 'sass-loader', 23 | @@ -18,7 +22,9 @@ const sassLoader = { 24 | }; 25 | const resolveUrlLoader = { 26 | loader: 'resolve-url-loader', 27 | - options: {} 28 | + options: { 29 | + sourceMap: true 30 | + } 31 | }; 32 | 33 | 34 | -------------------------------------------------------------------------------- /_tuts/sourcemaps-refactoring-loaders.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | index e84f57286..f9358b503 100644 3 | --- a/webpack.config.js 4 | +++ b/webpack.config.js 5 | @@ -2,6 +2,26 @@ const path = require('path'); 6 | const webpack = require('webpack'); 7 | const CopyWebpackPlugin = require('copy-webpack-plugin'); 8 | 9 | +const styleLoader = { 10 | + loader: 'style-loader', 11 | + options: {} 12 | +}; 13 | +const cssLoader = { 14 | + loader: 'css-loader', 15 | + options: {} 16 | +}; 17 | +const sassLoader = { 18 | + loader: 'sass-loader', 19 | + options: { 20 | + sourceMap: true 21 | + } 22 | +}; 23 | +const resolveUrlLoader = { 24 | + loader: 'resolve-url-loader', 25 | + options: {} 26 | +}; 27 | + 28 | + 29 | module.exports = { 30 | entry: { 31 | rep_log: './assets/js/rep_log.js', 32 | @@ -28,17 +48,17 @@ module.exports = { 33 | { 34 | test: /\.css$/, 35 | use: [ 36 | - 'style-loader', 37 | - 'css-loader', 38 | + styleLoader, 39 | + cssLoader, 40 | ] 41 | }, 42 | { 43 | test: /\.scss$/, 44 | use: [ 45 | - 'style-loader', 46 | - 'css-loader', 47 | - 'resolve-url-loader', 48 | - 'sass-loader?sourceMap', 49 | + styleLoader, 50 | + cssLoader, 51 | + resolveUrlLoader, 52 | + sassLoader, 53 | ] 54 | }, 55 | { 56 | -------------------------------------------------------------------------------- /_tuts/splitting-adding-syntax-dynamic-import.diff: -------------------------------------------------------------------------------- 1 | diff --git a/.babelrc b/.babelrc 2 | index 002b4aa0d..aa75e7d7d 100644 3 | --- a/.babelrc 4 | +++ b/.babelrc 5 | @@ -1,3 +1,4 @@ 6 | { 7 | - "presets": ["env"] 8 | + "presets": ["env"], 9 | + "plugins": ["syntax-dynamic-import"] 10 | } 11 | diff --git a/package.json b/package.json 12 | index 176560924..ade7cef58 100644 13 | --- a/package.json 14 | +++ b/package.json 15 | @@ -13,6 +13,7 @@ 16 | "devDependencies": { 17 | "babel-core": "^6.25.0", 18 | "babel-loader": "^7.1.1", 19 | + "babel-plugin-syntax-dynamic-import": "^6.18.0", 20 | "babel-polyfill": "^6.23.0", 21 | "babel-preset-env": "^1.6.0", 22 | "bootstrap-sass": "^3.3.7", 23 | diff --git a/yarn.lock b/yarn.lock 24 | index 540a424b6..dd72b59da 100644 25 | --- a/yarn.lock 26 | +++ b/yarn.lock 27 | @@ -398,6 +398,10 @@ babel-plugin-syntax-async-functions@^6.8.0: 28 | version "6.13.0" 29 | resolved "https://registry.yarnpkg.com/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz#cad9cad1191b5ad634bf30ae0872391e0647be95" 30 | 31 | +babel-plugin-syntax-dynamic-import@^6.18.0: 32 | + version "6.18.0" 33 | + resolved "https://registry.yarnpkg.com/babel-plugin-syntax-dynamic-import/-/babel-plugin-syntax-dynamic-import-6.18.0.tgz#8d6a26229c83745a9982a441051572caa179b1da" 34 | + 35 | babel-plugin-syntax-exponentiation-operator@^6.8.0: 36 | version "6.13.0" 37 | resolved "https://registry.yarnpkg.com/babel-plugin-syntax-exponentiation-operator/-/babel-plugin-syntax-exponentiation-operator-6.13.0.tgz#9ee7e8337290da95288201a6a57f4170317830de" 38 | -------------------------------------------------------------------------------- /_tuts/splitting-move-username-to-new-module.diff: -------------------------------------------------------------------------------- 1 | diff --git a/assets/js/Components/username_validation_error.js b/assets/js/Components/username_validation_error.js 2 | new file mode 100644 3 | index 000000000..ba1ebe41b 4 | --- /dev/null 5 | +++ b/assets/js/Components/username_validation_error.js 6 | @@ -0,0 +1,4 @@ 7 | +export default function($usernameInput) { 8 | + const $warning = $(''); 9 | + $usernameInput.before($warning); 10 | +} 11 | diff --git a/assets/js/login.js b/assets/js/login.js 12 | index afb516d4d..102430abd 100644 13 | --- a/assets/js/login.js 14 | +++ b/assets/js/login.js 15 | @@ -2,6 +2,7 @@ 16 | 17 | import $ from 'jquery'; 18 | import '../css/login.css'; 19 | +import username_validation_error from './Components/username_validation_error'; 20 | 21 | $(document).ready(function() { 22 | $('.js-recommended-login').on('click', '.js-show-login', function(e) { 23 | @@ -16,8 +17,8 @@ $(document).ready(function() { 24 | $('.login-long-username-warning').remove(); 25 | 26 | if ($usernameInput.val().length >= 20) { 27 | - const $warning = $(''); 28 | - $usernameInput.before($warning); 29 | + console.log(username_validation_error); 30 | + username_validation_error($usernameInput); 31 | } 32 | }); 33 | }); 34 | -------------------------------------------------------------------------------- /_tuts/splitting-try-to-split-in-username-error.diff: -------------------------------------------------------------------------------- 1 | diff --git a/assets/js/login.js b/assets/js/login.js 2 | index 102430abd..0615f07ff 100644 3 | --- a/assets/js/login.js 4 | +++ b/assets/js/login.js 5 | @@ -2,7 +2,6 @@ 6 | 7 | import $ from 'jquery'; 8 | import '../css/login.css'; 9 | -import username_validation_error from './Components/username_validation_error'; 10 | 11 | $(document).ready(function() { 12 | $('.js-recommended-login').on('click', '.js-show-login', function(e) { 13 | @@ -17,8 +16,11 @@ $(document).ready(function() { 14 | $('.login-long-username-warning').remove(); 15 | 16 | if ($usernameInput.val().length >= 20) { 17 | - console.log(username_validation_error); 18 | - username_validation_error($usernameInput); 19 | + // use code splitting to lazily load this "chunk" 20 | + import('./Components/username_validation_error').then(username_validation_error => { 21 | + console.log(username_validation_error); 22 | + username_validation_error($usernameInput); 23 | + }); 24 | } 25 | }); 26 | }); 27 | -------------------------------------------------------------------------------- /_tuts/splitting-use-default-key.diff: -------------------------------------------------------------------------------- 1 | diff --git a/assets/js/login.js b/assets/js/login.js 2 | index 0615f07ff..076a22937 100644 3 | --- a/assets/js/login.js 4 | +++ b/assets/js/login.js 5 | @@ -18,8 +18,7 @@ $(document).ready(function() { 6 | if ($usernameInput.val().length >= 20) { 7 | // use code splitting to lazily load this "chunk" 8 | import('./Components/username_validation_error').then(username_validation_error => { 9 | - console.log(username_validation_error); 10 | - username_validation_error($usernameInput); 11 | + username_validation_error.default($usernameInput); 12 | }); 13 | } 14 | }); 15 | -------------------------------------------------------------------------------- /_tuts/spread-operator-bad-copy-of-array.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index 844f61b68..ea7da28e3 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -2,4 +2,8 @@ let yummyThings = ['pizza', 'gelato', 'sushi', 'cheeseburger']; 6 | 7 | let greatThings = ['swimming', 'sunsets', ...yummyThings, 'New Orleans']; 8 | 9 | +let copyOfGreatThings = greatThings; 10 | +copyOfGreatThings.push('summer'); 11 | + 12 | console.log(greatThings); 13 | +console.log(copyOfGreatThings); 14 | -------------------------------------------------------------------------------- /_tuts/spread-operator-combining-arrays.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index ab67c0da0..844f61b68 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,7 +1,5 @@ 6 | -let printThreeThings = function(thing1, thing2, thing3) { 7 | - console.log(thing1, thing2, thing3); 8 | -}; 9 | - 10 | let yummyThings = ['pizza', 'gelato', 'sushi', 'cheeseburger']; 11 | 12 | -printThreeThings(...yummyThings); 13 | +let greatThings = ['swimming', 'sunsets', ...yummyThings, 'New Orleans']; 14 | + 15 | +console.log(greatThings); 16 | -------------------------------------------------------------------------------- /_tuts/spread-operator-copy-via-spread-op.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index ea7da28e3..a1997da7f 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -2,7 +2,7 @@ let yummyThings = ['pizza', 'gelato', 'sushi', 'cheeseburger']; 6 | 7 | let greatThings = ['swimming', 'sunsets', ...yummyThings, 'New Orleans']; 8 | 9 | -let copyOfGreatThings = greatThings; 10 | +let copyOfGreatThings = [...greatThings]; 11 | copyOfGreatThings.push('summer'); 12 | 13 | console.log(greatThings); 14 | -------------------------------------------------------------------------------- /_tuts/spread-operator-passing-4th-item.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index 548a19bf3..ab67c0da0 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -2,6 +2,6 @@ let printThreeThings = function(thing1, thing2, thing3) { 6 | console.log(thing1, thing2, thing3); 7 | }; 8 | 9 | -let yummyThings = ['pizza', 'gelato', 'sushi']; 10 | +let yummyThings = ['pizza', 'gelato', 'sushi', 'cheeseburger']; 11 | 12 | printThreeThings(...yummyThings); 13 | -------------------------------------------------------------------------------- /_tuts/template-strings-add-expressions.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index d484b0d78..34cfca487 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,4 +1,4 @@ 6 | const favoriteFood = 'gelato'; 7 | -const iLoveFood = 'The year is '+(new Date()).getFullYear()+' and my favorite food is '+favoriteFood; 8 | +const iLoveFood = `The year is ${(new Date()).getFullYear()} and my favorite food is ${favoriteFood}`; 9 | 10 | console.log(iLoveFood); 11 | -------------------------------------------------------------------------------- /_tuts/template-strings-expressions-with-undefined-vars.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 69f62c61f..71d497b15 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -215,14 +215,14 @@ 6 | } 7 | 8 | const rowTemplate = ` 9 | - 10 | - 11 | - 12 | - 13 | + 14 | + 15 | + 16 | + 17 | 11 | + 12 | + 13 | + 14 | + 22 | + 23 | +'; 24 | + 25 | window.RepLogApp = RepLogApp; 26 | })(window, jQuery, Routing, swal); 27 | -------------------------------------------------------------------------------- /_tuts/template-strings-removed-tagged-template.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index f3bd6ab95..1998b33f3 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -211,13 +211,7 @@ 6 | } 7 | } 8 | 9 | - function upper(template, ...expressions) { 10 | - return template.reduce((accumulator, part, i) => { 11 | - return accumulator + (expressions[i - 1].toUpperCase ? expressions[i - 1].toUpperCase() : expressions[i - 1]) + part 12 | - }) 13 | - } 14 | - 15 | - const rowTemplate = (repLog) => upper` 16 | + const rowTemplate = (repLog) => ` 17 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /_tuts/template-strings-simple-example-no-ticks.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index a1997da7f..d484b0d78 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,9 +1,4 @@ 6 | -let yummyThings = ['pizza', 'gelato', 'sushi', 'cheeseburger']; 7 | +const favoriteFood = 'gelato'; 8 | +const iLoveFood = 'The year is '+(new Date()).getFullYear()+' and my favorite food is '+favoriteFood; 9 | 10 | -let greatThings = ['swimming', 'sunsets', ...yummyThings, 'New Orleans']; 11 | - 12 | -let copyOfGreatThings = [...greatThings]; 13 | -copyOfGreatThings.push('summer'); 14 | - 15 | -console.log(greatThings); 16 | -console.log(copyOfGreatThings); 17 | +console.log(iLoveFood); 18 | -------------------------------------------------------------------------------- /_tuts/template-strings-tagged-template-for-upper.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 1998b33f3..f3bd6ab95 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -211,7 +211,13 @@ 6 | } 7 | } 8 | 9 | - const rowTemplate = (repLog) => ` 10 | + function upper(template, ...expressions) { 11 | + return template.reduce((accumulator, part, i) => { 12 | + return accumulator + (expressions[i - 1].toUpperCase ? expressions[i - 1].toUpperCase() : expressions[i - 1]) + part 13 | + }) 14 | + } 15 | + 16 | + const rowTemplate = (repLog) => upper` 17 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /_tuts/template-strings-turn-tpl-into-function.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 71d497b15..1998b33f3 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -170,10 +170,7 @@ 6 | // let {id, itemLabel, reps, totallyMadeUpKey = 'whatever!'} = repLog; 7 | // console.log(id, itemLabel, reps, totallyMadeUpKey); 8 | 9 | - const tplText = rowTemplate; 10 | - const tpl = _.template(tplText); 11 | - 12 | - const html = tpl(repLog); 13 | + const html = rowTemplate(repLog); 14 | this.$wrapper.find('tbody').append($.parseHTML(html)); 15 | 16 | this.updateTotalWeightLifted(); 17 | @@ -214,7 +211,7 @@ 18 | } 19 | } 20 | 21 | - const rowTemplate = ` 22 | + const rowTemplate = (repLog) => ` 23 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /_tuts/use-api-print-data-back-from-success.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 0668af577..2fc25055e 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -78,6 +78,7 @@ 6 | data: JSON.stringify(formData), 7 | success: function(data) { 8 | self._clearForm(); 9 | + self._addRow(data); 10 | }, 11 | error: function(jqXHR) { 12 | var errorData = JSON.parse(jqXHR.responseText); 13 | @@ -116,6 +117,10 @@ 14 | 15 | var $form = this.$wrapper.find(this._selectors.newRepForm); 16 | $form[0].reset(); 17 | + }, 18 | + 19 | + _addRow: function(repLog) { 20 | + console.log(repLog); 21 | } 22 | }); 23 | 24 | -------------------------------------------------------------------------------- /_tuts/use-api-remove-ajax-controller-code.diff: -------------------------------------------------------------------------------- 1 | diff --git a/src/AppBundle/Controller/LiftController.php b/src/AppBundle/Controller/LiftController.php 2 | index 31a9f4357..4ba1d5b1f 100644 3 | --- a/src/AppBundle/Controller/LiftController.php 4 | +++ b/src/AppBundle/Controller/LiftController.php 5 | @@ -28,13 +28,6 @@ class LiftController extends BaseController 6 | $em->persist($repLog); 7 | $em->flush(); 8 | 9 | - // return a blank form after success 10 | - if ($request->isXmlHttpRequest()) { 11 | - return $this->render('lift/_repRow.html.twig', [ 12 | - 'repLog' => $repLog 13 | - ]); 14 | - } 15 | - 16 | $this->addFlash('notice', 'Reps crunched!'); 17 | 18 | return $this->redirectToRoute('lift'); 19 | @@ -48,15 +41,6 @@ class LiftController extends BaseController 20 | $totalWeight += $repLog->getTotalWeightLifted(); 21 | } 22 | 23 | - // render just the form for AJAX, there is a validation error 24 | - if ($request->isXmlHttpRequest()) { 25 | - $html = $this->renderView('lift/_form.html.twig', [ 26 | - 'form' => $form->createView() 27 | - ]); 28 | - 29 | - return new Response($html, 400); 30 | - } 31 | - 32 | return $this->render('lift/index.html.twig', array( 33 | 'form' => $form->createView(), 34 | 'repLogs' => $repLogs, 35 | -------------------------------------------------------------------------------- /_tuts/use-api-simple-field-names.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/_form.html.twig b/app/Resources/views/lift/_form.html.twig 2 | index b0f12f64f..92993e5a7 100644 3 | --- a/app/Resources/views/lift/_form.html.twig 4 | +++ b/app/Resources/views/lift/_form.html.twig 5 | @@ -4,7 +4,7 @@ 6 | What did you lift? 7 | 8 | 22 | 23 | -------------------------------------------------------------------------------- /_tuts/use-api-starting-to-handle-errors.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 05ba12428..cbc6d6945 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -67,6 +67,7 @@ 6 | $.each($form.serializeArray(), function(key, fieldData) { 7 | formData[fieldData.name] = fieldData.value 8 | }); 9 | + var self = this; 10 | $.ajax({ 11 | url: $form.data('url'), 12 | method: 'POST', 13 | @@ -76,10 +77,14 @@ 14 | console.log('success!'); 15 | }, 16 | error: function(jqXHR) { 17 | - // todo 18 | - console.log('error :('); 19 | + var errorData = JSON.parse(jqXHR.responseText); 20 | + self._mapErrorsToForm(errorData.errors); 21 | } 22 | }); 23 | + }, 24 | + 25 | + _mapErrorsToForm: function(errorData) { 26 | + console.log(errorData); 27 | } 28 | }); 29 | 30 | -------------------------------------------------------------------------------- /_tuts/versioning-add-hash.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | index b98e8c7c9..f9727d629 100644 3 | --- a/webpack.config.js 4 | +++ b/webpack.config.js 5 | @@ -4,6 +4,7 @@ const CopyWebpackPlugin = require('copy-webpack-plugin'); 6 | const ExtractTextPlugin = require('extract-text-webpack-plugin'); 7 | 8 | const useDevServer = false; 9 | +const useVersioning = true; 10 | const publicPath = useDevServer ? 'http://localhost:8080/build/' : '/build/'; 11 | const isProduction = process.env.NODE_ENV === 'production'; 12 | const useSourcemaps = !isProduction; 13 | @@ -42,7 +43,7 @@ const webpackConfig = { 14 | }, 15 | output: { 16 | path: path.resolve(__dirname, 'web', 'build'), 17 | - filename: '[name].js', 18 | + filename: useVersioning ? '[name].[hash:6].js' : '[name].js', 19 | publicPath: publicPath, 20 | }, 21 | module: { 22 | @@ -125,7 +126,9 @@ const webpackConfig = { 23 | minChunks: Infinity 24 | }), 25 | 26 | - new ExtractTextPlugin('[name].css'), 27 | + new ExtractTextPlugin( 28 | + useVersioning ? '[name].[contenthash:6].css' : '[name].css' 29 | + ), 30 | ], 31 | devtool: useSourcemaps ? 'inline-source-map' : false, 32 | devServer: { 33 | -------------------------------------------------------------------------------- /_tuts/versioning-add-version-strategy.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/config/config.yml b/app/config/config.yml 2 | index 20d4525e6..043ada197 100644 3 | --- a/app/config/config.yml 4 | +++ b/app/config/config.yml 5 | @@ -31,7 +31,8 @@ framework: 6 | save_path: "%kernel.root_dir%/../var/sessions/%kernel.environment%" 7 | fragments: ~ 8 | http_method_override: true 9 | - assets: ~ 10 | + assets: 11 | + json_manifest_path: '%kernel.project_dir%/web/build/manifest.json' 12 | 13 | # Twig Configuration 14 | twig: 15 | diff --git a/webpack.config.js b/webpack.config.js 16 | index 36543d467..cf98a4399 100644 17 | --- a/webpack.config.js 18 | +++ b/webpack.config.js 19 | @@ -132,6 +132,7 @@ const webpackConfig = { 20 | ), 21 | 22 | new ManifestPlugin({ 23 | + basePath: 'build/', 24 | // always dump manifest 25 | writeToFileEmit: true 26 | }), 27 | -------------------------------------------------------------------------------- /_tuts/versioning-always-dump-manifest.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | index 475086f3b..36543d467 100644 3 | --- a/webpack.config.js 4 | +++ b/webpack.config.js 5 | @@ -131,7 +131,10 @@ const webpackConfig = { 6 | useVersioning ? '[name].[contenthash:6].css' : '[name].css' 7 | ), 8 | 9 | - new ManifestPlugin(), 10 | + new ManifestPlugin({ 11 | + // always dump manifest 12 | + writeToFileEmit: true 13 | + }), 14 | ], 15 | devtool: useSourcemaps ? 'inline-source-map' : false, 16 | devServer: { 17 | -------------------------------------------------------------------------------- /_tuts/versioning-hashedidsplugin.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | index 51cc96a05..e8905da57 100644 3 | --- a/webpack.config.js 4 | +++ b/webpack.config.js 5 | @@ -140,6 +140,10 @@ const webpackConfig = { 6 | 7 | // allows for [chunkhash] 8 | new WebpackChunkHash(), 9 | + 10 | + // keep module ids consistent between builds 11 | + // so that hashes doesn't suddenly change 12 | + isProduction ? new webpack.HashedModuleIdsPlugin() : new webpack.NamedModulesPlugin() 13 | ], 14 | devtool: useSourcemaps ? 'inline-source-map' : false, 15 | devServer: { 16 | -------------------------------------------------------------------------------- /_tuts/watch-use-watch-make-a-change.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 5da1ce69a..68380f529 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -63,7 +63,7 @@ const Helper = require('./RepLogAppHelper'); 6 | const $link = $(e.currentTarget); 7 | 8 | swal({ 9 | - title: 'Delete this log?', 10 | + title: 'Delete this log???', 11 | text: 'What? Did you not actually lift this?', 12 | showCancelButton: true, 13 | showLoaderOnConfirm: true, 14 | -------------------------------------------------------------------------------- /_tuts/weakmap-change-to-weakmap.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index e0094791d..e03faf006 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,4 +1,4 @@ 6 | -let foods = new Map(); 7 | +let foods = new WeakMap(); 8 | foods.set('italian', 'gelato'); 9 | foods.set('mexican', 'tortas'); 10 | foods.set('canadian', 'poutine'); 11 | -------------------------------------------------------------------------------- /_tuts/weakmap-gc-experiment-with-map.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 60f505d37..376810c65 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -7,7 +7,8 @@ 6 | class RepLogApp { 7 | constructor($wrapper) { 8 | this.$wrapper = $wrapper; 9 | - HelperInstances.set(this, new Helper(this.$wrapper)); 10 | + HelperInstances.set(this, new Helper($wrapper)); 11 | + return; 12 | 13 | this.loadRepLogs(); 14 | 15 | @@ -230,5 +231,11 @@ 16 | 17 | `; 18 | 19 | + new RepLogApp($('body')); 20 | + new RepLogApp($('body')); 21 | + new RepLogApp($('body')); 22 | + new RepLogApp($('body')); 23 | + console.log(HelperInstances); 24 | + 25 | window.RepLogApp = RepLogApp; 26 | })(window, jQuery, Routing, swal); 27 | -------------------------------------------------------------------------------- /_tuts/weakmap-make-helper-truly-private.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 6e38621c8..d3db40b84 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -2,10 +2,12 @@ 6 | 7 | (function(window, $, Routing, swal) { 8 | 9 | + let HelperInstance = null; 10 | + 11 | class RepLogApp { 12 | constructor($wrapper) { 13 | this.$wrapper = $wrapper; 14 | - this.helper = new Helper(this.$wrapper); 15 | + HelperInstance = new Helper(this.$wrapper); 16 | 17 | this.loadRepLogs(); 18 | 19 | @@ -47,7 +49,7 @@ 20 | 21 | updateTotalWeightLifted() { 22 | this.$wrapper.find('.js-total-weight').html( 23 | - this.helper.getTotalWeightString() 24 | + HelperInstance.getTotalWeightString() 25 | ); 26 | } 27 | 28 | -------------------------------------------------------------------------------- /_tuts/weakmap-removing-debug-code.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 961fe0591..640f9be6b 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -8,7 +8,6 @@ 6 | constructor($wrapper) { 7 | this.$wrapper = $wrapper; 8 | HelperInstances.set(this, new Helper($wrapper)); 9 | - return; 10 | 11 | this.loadRepLogs(); 12 | 13 | @@ -231,11 +230,5 @@ 14 | 15 | `; 16 | 17 | - new RepLogApp($('body')); 18 | - new RepLogApp($('body')); 19 | - new RepLogApp($('body')); 20 | - new RepLogApp($('body')); 21 | - console.log(HelperInstances); 22 | - 23 | window.RepLogApp = RepLogApp; 24 | })(window, jQuery, Routing, swal); 25 | -------------------------------------------------------------------------------- /_tuts/weakmap-set-ussouthernstates-to-null.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index e50c2d326..96c132c8b 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -5,6 +5,7 @@ foods.set(['canadian'], 'poutine'); 6 | 7 | let southernUsStates = ['Tennessee', 'Kentucky', 'Texas']; 8 | foods.set(southernUsStates, 'hot chicken'); 9 | +southernUsStates = null; 10 | 11 | console.log( 12 | foods.get(['italian']), 13 | -------------------------------------------------------------------------------- /_tuts/weakmap-use-map-for-multiple-instances.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index d3db40b84..60f505d37 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -2,12 +2,12 @@ 6 | 7 | (function(window, $, Routing, swal) { 8 | 9 | - let HelperInstance = null; 10 | + let HelperInstances = new Map(); 11 | 12 | class RepLogApp { 13 | constructor($wrapper) { 14 | this.$wrapper = $wrapper; 15 | - HelperInstance = new Helper(this.$wrapper); 16 | + HelperInstances.set(this, new Helper(this.$wrapper)); 17 | 18 | this.loadRepLogs(); 19 | 20 | @@ -49,7 +49,7 @@ 21 | 22 | updateTotalWeightLifted() { 23 | this.$wrapper.find('.js-total-weight').html( 24 | - HelperInstance.getTotalWeightString() 25 | + HelperInstances.get(this).getTotalWeightString() 26 | ); 27 | } 28 | 29 | -------------------------------------------------------------------------------- /_tuts/weakmap-use-only-object-keys.diff: -------------------------------------------------------------------------------- 1 | diff --git a/play.js b/play.js 2 | index e03faf006..e50c2d326 100644 3 | --- a/play.js 4 | +++ b/play.js 5 | @@ -1,13 +1,13 @@ 6 | let foods = new WeakMap(); 7 | -foods.set('italian', 'gelato'); 8 | -foods.set('mexican', 'tortas'); 9 | -foods.set('canadian', 'poutine'); 10 | +foods.set(['italian'], 'gelato'); 11 | +foods.set(['mexican'], 'tortas'); 12 | +foods.set(['canadian'], 'poutine'); 13 | 14 | let southernUsStates = ['Tennessee', 'Kentucky', 'Texas']; 15 | foods.set(southernUsStates, 'hot chicken'); 16 | 17 | console.log( 18 | - foods.get('italian'), 19 | + foods.get(['italian']), 20 | foods.get(southernUsStates), 21 | foods.size 22 | ); 23 | -------------------------------------------------------------------------------- /_tuts/weakmap-using-weakmap-for-gc.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index 376810c65..961fe0591 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -2,7 +2,7 @@ 6 | 7 | (function(window, $, Routing, swal) { 8 | 9 | - let HelperInstances = new Map(); 10 | + let HelperInstances = new WeakMap(); 11 | 12 | class RepLogApp { 13 | constructor($wrapper) { 14 | -------------------------------------------------------------------------------- /_tuts/webpack-initial-webpack-config-js.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | new file mode 100644 3 | index 000000000..b1df3349c 4 | --- /dev/null 5 | +++ b/webpack.config.js 6 | @@ -0,0 +1,7 @@ 7 | +module.exports = { 8 | + entry: './web/assets/js/RepLogApp.js', 9 | + output: { 10 | + path: __dirname+'/web/build', 11 | + filename: 'rep_log.js', 12 | + } 13 | +}; 14 | -------------------------------------------------------------------------------- /_tuts/webpack-require-path.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | index faaacf7bd..38724e7ad 100644 3 | --- a/webpack.config.js 4 | +++ b/webpack.config.js 5 | @@ -1,3 +1,5 @@ 6 | +const path = require('path'); 7 | + 8 | module.exports = { 9 | entry: './web/assets/js/RepLogApp.js', 10 | output: { 11 | -------------------------------------------------------------------------------- /_tuts/webpack-try-to-use-path.diff: -------------------------------------------------------------------------------- 1 | diff --git a/webpack.config.js b/webpack.config.js 2 | index b1df3349c..faaacf7bd 100644 3 | --- a/webpack.config.js 4 | +++ b/webpack.config.js 5 | @@ -1,7 +1,7 @@ 6 | module.exports = { 7 | entry: './web/assets/js/RepLogApp.js', 8 | output: { 9 | - path: __dirname+'/web/build', 10 | + path: path.resolve(__dirname, 'web', 'build'), 11 | filename: 'rep_log.js', 12 | } 13 | }; 14 | -------------------------------------------------------------------------------- /_tuts/window-forget-var.diff: -------------------------------------------------------------------------------- 1 | diff --git a/app/Resources/views/lift/index.html.twig b/app/Resources/views/lift/index.html.twig 2 | index 421365804..8b3ba28bc 100644 3 | --- a/app/Resources/views/lift/index.html.twig 4 | +++ b/app/Resources/views/lift/index.html.twig 5 | @@ -71,6 +71,7 @@ 6 | 7 | 8 | 7 | 8 | 7 | 8 | 7 | 8 |
What
<%= itemLabel %><%= reps %><%= totalWeightLifted %>
${repLog.itemLabel}${repLog.reps}${repLog.totalWeightLifted} 18 | 23 | 24 | 25 | -------------------------------------------------------------------------------- /_tuts/template-strings-moving-template-with-single-quotes.diff: -------------------------------------------------------------------------------- 1 | diff --git a/web/assets/js/RepLogApp.js b/web/assets/js/RepLogApp.js 2 | index cd14d90d8..9ca8a8fa3 100644 3 | --- a/web/assets/js/RepLogApp.js 4 | +++ b/web/assets/js/RepLogApp.js 5 | @@ -213,5 +213,21 @@ 6 | } 7 | } 8 | 9 | + const rowTemplate = ' 10 | +
<%= itemLabel %><%= reps %><%= totalWeightLifted %> 15 | + 19 | + 20 | + 21 | +
${repLog.itemLabel}${repLog.reps}
${repLog.itemLabel}${repLog.reps}
${repLog.itemLabel}${repLog.reps}