From 533ca287b5b454f33d1468daaa0c8c6095748735 Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Tue, 18 Apr 2017 11:41:16 +0200 Subject: [PATCH 01/30] initial code added (index.html) --- .gitignore | 6 ++++++ index.html | 23 +++++++++++++++++++++++ 2 files changed, 29 insertions(+) create mode 100644 .gitignore create mode 100644 index.html diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..4efaa27 --- /dev/null +++ b/.gitignore @@ -0,0 +1,6 @@ +.idea/ +.vscode/ +*.iml +.tmp +node_modules +debug.log \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..89e5c26 --- /dev/null +++ b/index.html @@ -0,0 +1,23 @@ + + + + + + + + + + + + JS Training code + + + + + + +
+

JS Training

+
+ + \ No newline at end of file From b1c38177813d284951637ca0a7bbfe01f368e3aa Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Tue, 18 Apr 2017 12:23:45 +0200 Subject: [PATCH 02/30] closure exercise description added --- index.html | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/index.html b/index.html index 89e5c26..3c830d3 100644 --- a/index.html +++ b/index.html @@ -19,5 +19,21 @@

JS Training

+ + \ No newline at end of file From c6c8d4b0d5f56e21a4dc5fff3e88273c3395d666 Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Tue, 18 Apr 2017 12:32:47 +0200 Subject: [PATCH 03/30] closure exercise solved --- index.html | 16 +--------------- 1 file changed, 1 insertion(+), 15 deletions(-) diff --git a/index.html b/index.html index 3c830d3..e14fa1c 100644 --- a/index.html +++ b/index.html @@ -20,20 +20,6 @@

JS Training

- + \ No newline at end of file From 6d43c82f6f021bb982df08552560daab8c98f5c7 Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Tue, 18 Apr 2017 12:33:04 +0200 Subject: [PATCH 04/30] closure exercise solved --- main.js | 25 +++++++++++++++++++++++++ 1 file changed, 25 insertions(+) create mode 100644 main.js diff --git a/main.js b/main.js new file mode 100644 index 0000000..b103a56 --- /dev/null +++ b/main.js @@ -0,0 +1,25 @@ +'use strict'; + +console.log('hello from main js'); + +var personFactory = function(){ + var details = { + firstName: 'John', + lastName: 'example', + accounts: [{ + balance: 1000.00, + currency: 'EUR' + }] + } + + return { + firstName: details.firstName, + lastName: details.lastName, + sayHello: function(){ + return 'Hi, my name is ' + this.firstName + ' ' + this.lastName + ' and I have ' + details.accounts.length + ' bank account(s)'; + } + }; +}; + +var johnExample = personFactory(); +console.log(johnExample.sayHello()); From 38df3649615c910ffc8440df125ab2381b72d723 Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Tue, 18 Apr 2017 13:12:16 +0200 Subject: [PATCH 05/30] module pattern exercise added --- main.js | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/main.js b/main.js index b103a56..ae7e7fe 100644 --- a/main.js +++ b/main.js @@ -2,19 +2,26 @@ console.log('hello from main js'); +// rename personFactory to person and use module pattern with IIFE here var personFactory = function(){ var details = { firstName: 'John', lastName: 'example', + // move accounts from details object to returned object accounts: [{ balance: 1000.00, currency: 'EUR' }] - } + }; + // create local calculateBalance() function which iterates over all accounts and calculates and returns total balance + // watch out for the 'this' context return { firstName: details.firstName, lastName: details.lastName, + // add accounts list here + // update sayHello() to print also the total balance + // remember to update details.accounts.length call and call calculateBalance with the correct context of 'this' sayHello: function(){ return 'Hi, my name is ' + this.firstName + ' ' + this.lastName + ' and I have ' + details.accounts.length + ' bank account(s)'; } From 948e44f37816e2650a20a2c4dceecbd0fbed08e6 Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Tue, 18 Apr 2017 13:18:25 +0200 Subject: [PATCH 06/30] module pattern exercise solved --- main.js | 40 +++++++++++++++++++++++----------------- 1 file changed, 23 insertions(+), 17 deletions(-) diff --git a/main.js b/main.js index ae7e7fe..7bd6179 100644 --- a/main.js +++ b/main.js @@ -2,31 +2,37 @@ console.log('hello from main js'); -// rename personFactory to person and use module pattern with IIFE here -var personFactory = function(){ +var person = (function () { var details = { firstName: 'John', lastName: 'example', - // move accounts from details object to returned object - accounts: [{ - balance: 1000.00, - currency: 'EUR' - }] }; - // create local calculateBalance() function which iterates over all accounts and calculates and returns total balance - // watch out for the 'this' context + var calculateBalance = function () { + var totalBalance = 0; + + for (var index = 0; index < this.accounts.length; index++) { + totalBalance = totalBalance + this.accounts[index].balance; + } + + return totalBalance; + }; return { firstName: details.firstName, lastName: details.lastName, - // add accounts list here - // update sayHello() to print also the total balance - // remember to update details.accounts.length call and call calculateBalance with the correct context of 'this' - sayHello: function(){ - return 'Hi, my name is ' + this.firstName + ' ' + this.lastName + ' and I have ' + details.accounts.length + ' bank account(s)'; + accounts: [{ + balance: 1000.00, + currency: 'EUR' + }], + addAccount: function (account) { + this.accounts.push(account); + }, + sayHello: function () { + return 'Hi, my name is ' + this.firstName + ' ' + this.lastName + ' and I have ' + this.accounts.length + ' bank account(s) with total balance ' + calculateBalance.apply(this); } }; -}; +})(); -var johnExample = personFactory(); -console.log(johnExample.sayHello()); +console.log(person.sayHello()); +person.addAccount({ balance: 1500 }); +console.log(person.sayHello()); From 38391e69e38ab9e8e0857485ecad3736f9c7a15d Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Tue, 18 Apr 2017 13:36:09 +0200 Subject: [PATCH 07/30] instructions for constructor function exercise --- main.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/main.js b/main.js index 7bd6179..82be365 100644 --- a/main.js +++ b/main.js @@ -2,6 +2,9 @@ console.log('hello from main js'); +// create constructor function for a bank account +// it should take balance and currency as parameters + var person = (function () { var details = { firstName: 'John', @@ -34,5 +37,6 @@ var person = (function () { })(); console.log(person.sayHello()); +// create an account object for addAccount method with a constructor function here instead of an object literal expression person.addAccount({ balance: 1500 }); console.log(person.sayHello()); From 4f620a7d4939056753584ef83f291e0754c6ef5d Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Tue, 18 Apr 2017 13:57:38 +0200 Subject: [PATCH 08/30] construction function exercise solved --- main.js | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/main.js b/main.js index 82be365..3626807 100644 --- a/main.js +++ b/main.js @@ -2,8 +2,10 @@ console.log('hello from main js'); -// create constructor function for a bank account -// it should take balance and currency as parameters +var Account = function (balance, currency) { + this.balance = balance; + this.currency = currency; +}; var person = (function () { var details = { @@ -37,6 +39,5 @@ var person = (function () { })(); console.log(person.sayHello()); -// create an account object for addAccount method with a constructor function here instead of an object literal expression -person.addAccount({ balance: 1500 }); +person.addAccount(new Account(1500, 'EUR')); console.log(person.sayHello()); From b38bc1f3d75a5a5302609e9124a60a80f850579c Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Tue, 18 Apr 2017 14:53:36 +0200 Subject: [PATCH 09/30] es6 syntax exercise added --- main.js | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/main.js b/main.js index 3626807..c7e3dda 100644 --- a/main.js +++ b/main.js @@ -1,20 +1,25 @@ +// remove this 'use strict'; console.log('hello from main js'); +// replace with class Account with the appropriate constructor (balance, currency) var Account = function (balance, currency) { this.balance = balance; this.currency = currency; }; +// replace with class Person with the appropriate constructor (firstName, lastName, accounts) var person = (function () { var details = { firstName: 'John', lastName: 'example', }; + // replace with class method _calculateBalance() var calculateBalance = function () { var totalBalance = 0; + // use 'of' operator instead for (var index = 0; index < this.accounts.length; index++) { totalBalance = totalBalance + this.accounts[index].balance; } @@ -29,15 +34,20 @@ var person = (function () { balance: 1000.00, currency: 'EUR' }], + // replace with class method addAccount(account) addAccount: function (account) { this.accounts.push(account); }, + // replace with class method sayHello() sayHello: function () { + // use string interpolation here return 'Hi, my name is ' + this.firstName + ' ' + this.lastName + ' and I have ' + this.accounts.length + ' bank account(s) with total balance ' + calculateBalance.apply(this); } + // implement class method filterPositiveAccounts() which finds all accounts with a positive balance }; })(); +// define new person with 'const' keyword, do some logging before / after adding accounts, print the result of filterPositiveAccounts() method console.log(person.sayHello()); person.addAccount(new Account(1500, 'EUR')); console.log(person.sayHello()); From 10c7b347ced11d6f84aec04f8a72eadc5f9f2ada Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Tue, 18 Apr 2017 15:32:06 +0200 Subject: [PATCH 10/30] es6 syntax exercise solved --- main.js | 67 ++++++++++++++++++++++++++------------------------------- 1 file changed, 31 insertions(+), 36 deletions(-) diff --git a/main.js b/main.js index c7e3dda..eb6b36f 100644 --- a/main.js +++ b/main.js @@ -3,51 +3,46 @@ console.log('hello from main js'); -// replace with class Account with the appropriate constructor (balance, currency) -var Account = function (balance, currency) { - this.balance = balance; - this.currency = currency; +class Account { + constructor(balance, currency) { + this.balance = balance; + this.currency = currency; + }; }; -// replace with class Person with the appropriate constructor (firstName, lastName, accounts) -var person = (function () { - var details = { - firstName: 'John', - lastName: 'example', +class Person { + constructor(firstName, lastName, accounts) { + this.firstName = firstName; + this.lastName = lastName; + this.accounts = accounts; }; - // replace with class method _calculateBalance() - var calculateBalance = function () { - var totalBalance = 0; - // use 'of' operator instead - for (var index = 0; index < this.accounts.length; index++) { - totalBalance = totalBalance + this.accounts[index].balance; - } + addAccount(account) { + this.accounts.push(account); + }; - return totalBalance; + sayHello() { + return `Hi, my name is ${this.firstName} ${this.lastName} and I have ${this.accounts.length} bank account(s) with total balance ${this._calculateBalance()}`; + }; + + filterPositiveAccounts() { + return this.accounts.filter(account => account.balance > 0); }; - return { - firstName: details.firstName, - lastName: details.lastName, - accounts: [{ - balance: 1000.00, - currency: 'EUR' - }], - // replace with class method addAccount(account) - addAccount: function (account) { - this.accounts.push(account); - }, - // replace with class method sayHello() - sayHello: function () { - // use string interpolation here - return 'Hi, my name is ' + this.firstName + ' ' + this.lastName + ' and I have ' + this.accounts.length + ' bank account(s) with total balance ' + calculateBalance.apply(this); + _calculateBalance() { + let totalBalance = 0; + + for (let account of this.accounts) { + totalBalance = totalBalance + account.balance; } - // implement class method filterPositiveAccounts() which finds all accounts with a positive balance + + return totalBalance; }; -})(); +}; -// define new person with 'const' keyword, do some logging before / after adding accounts, print the result of filterPositiveAccounts() method +const person = new Person('John', 'Example', [new Account(1500, 'EUR')]); console.log(person.sayHello()); -person.addAccount(new Account(1500, 'EUR')); +person.addAccount(new Account(-2500, 'EUR')); console.log(person.sayHello()); +console.log(person.filterPositiveAccounts()); + From dd94c79c9f7dfbc5ff32d441c18f2e6f09707741 Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Tue, 18 Apr 2017 15:52:14 +0200 Subject: [PATCH 11/30] unnecessary lines deleted --- main.js | 3 --- 1 file changed, 3 deletions(-) diff --git a/main.js b/main.js index eb6b36f..679f094 100644 --- a/main.js +++ b/main.js @@ -1,6 +1,3 @@ -// remove this -'use strict'; - console.log('hello from main js'); class Account { From 303df0df8b9a8fab1a616086e83ec5834932e8e7 Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Tue, 18 Apr 2017 16:16:03 +0200 Subject: [PATCH 12/30] promise exercise description added --- main.js | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/main.js b/main.js index 679f094..109e53e 100644 --- a/main.js +++ b/main.js @@ -1,5 +1,6 @@ console.log('hello from main js'); +// add acount number class Account { constructor(balance, currency) { this.balance = balance; @@ -26,6 +27,12 @@ class Person { return this.accounts.filter(account => account.balance > 0); }; + // add findAccount(accountNumber) method (use Array.find method) + + // add withdraw(accountNumber, amount) method which returns promise (use Promise API -> new Promise(resolve, reject)) + // promise is resolved after 3 seconds (use setTimeout(callback)) when the account is found and the amount >= account.balance + // promise is rejected either when account is not found or there are not enough funds on the found account + _calculateBalance() { let totalBalance = 0; @@ -37,9 +44,12 @@ class Person { }; }; +// add account numbers to all Account constructors const person = new Person('John', 'Example', [new Account(1500, 'EUR')]); console.log(person.sayHello()); person.addAccount(new Account(-2500, 'EUR')); console.log(person.sayHello()); console.log(person.filterPositiveAccounts()); +// call person.withdraw for different cases + From 183c32cb69519203b61456ed9266e7ef293514ef Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Tue, 18 Apr 2017 16:47:09 +0200 Subject: [PATCH 13/30] promise exercise solved --- main.js | 45 +++++++++++++++++++++++++++++++++++---------- 1 file changed, 35 insertions(+), 10 deletions(-) diff --git a/main.js b/main.js index 109e53e..b833f45 100644 --- a/main.js +++ b/main.js @@ -1,10 +1,10 @@ console.log('hello from main js'); -// add acount number class Account { - constructor(balance, currency) { + constructor(balance, currency, number) { this.balance = balance; this.currency = currency; + this.number = number; }; }; @@ -27,11 +27,28 @@ class Person { return this.accounts.filter(account => account.balance > 0); }; - // add findAccount(accountNumber) method (use Array.find method) + findAccount(accountNumber) { + return this.accounts.find(account => account.number === accountNumber); + }; + + withdraw(accountNumber, amount) { + const promise = new Promise((resolve, reject) => { + const foundAccount = this.findAccount(accountNumber); - // add withdraw(accountNumber, amount) method which returns promise (use Promise API -> new Promise(resolve, reject)) - // promise is resolved after 3 seconds (use setTimeout(callback)) when the account is found and the amount >= account.balance - // promise is rejected either when account is not found or there are not enough funds on the found account + if (foundAccount && foundAccount.balance >= amount) { + setTimeout(() => { + foundAccount.balance = foundAccount.balance - amount; + resolve(`Operation successful, withdrawn ${amount} from account ${accountNumber}, remaining balance ${foundAccount.balance}`); + }, 3000); + } else if (!foundAccount) { + reject('Incorrect account number') + } else { + reject(`Not enough funds on account number ${accountNumber}`); + } + }); + + return promise; + }; _calculateBalance() { let totalBalance = 0; @@ -44,12 +61,20 @@ class Person { }; }; -// add account numbers to all Account constructors -const person = new Person('John', 'Example', [new Account(1500, 'EUR')]); +const person = new Person('John', 'Example', [new Account(1500, 'EUR', 1)]); console.log(person.sayHello()); -person.addAccount(new Account(-2500, 'EUR')); +person.addAccount(new Account(-2500, 'EUR', 2)); console.log(person.sayHello()); console.log(person.filterPositiveAccounts()); -// call person.withdraw for different cases +person.withdraw(1, 200) + .then(success => { + console.log(success); + console.log('------------------after successful withdrawal--------------------------') + console.log(person.sayHello()); + }) + .catch(error => console.warn(error)); + +person.withdraw(2, 200).catch(error => console.warn(error)); +person.withdraw(3, 500).catch(error => console.warn(error)); From e5a8e7ffab5215a8fcca5eb3e6fa7ca42b4a6959 Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Wed, 19 Apr 2017 15:54:17 +0200 Subject: [PATCH 14/30] managing dependencies description added --- index.html | 1 + 1 file changed, 1 insertion(+) diff --git a/index.html b/index.html index e14fa1c..6c416e1 100644 --- a/index.html +++ b/index.html @@ -12,6 +12,7 @@ JS Training code + From e70c2a813f9b8dc1b75d40b22ebfe0beb8b719e5 Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Wed, 19 Apr 2017 15:57:28 +0200 Subject: [PATCH 15/30] managing-deps exercise solved --- index.html | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/index.html b/index.html index 6c416e1..3790aa5 100644 --- a/index.html +++ b/index.html @@ -12,8 +12,7 @@ JS Training code - - + From bf39b1ada3dfb8293abe702405913269ce22ed9d Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Thu, 20 Apr 2017 11:49:48 +0200 Subject: [PATCH 16/30] package.json and karma config added --- karma.conf.js | 66 +++++++++++++++++++++++++++++++++++++++++++++++++++ package.json | 32 +++++++++++++++++++++++++ 2 files changed, 98 insertions(+) create mode 100644 karma.conf.js create mode 100644 package.json diff --git a/karma.conf.js b/karma.conf.js new file mode 100644 index 0000000..51628a5 --- /dev/null +++ b/karma.conf.js @@ -0,0 +1,66 @@ +// Karma configuration +// Generated on Tue Apr 18 2017 20:02:46 GMT+0200 (Środkowoeuropejski czas letni) + +module.exports = function(config) { + config.set({ + + // base path that will be used to resolve all patterns (eg. files, exclude) + basePath: '', + + + // frameworks to use + // available frameworks: https://npmjs.org/browse/keyword/karma-adapter + frameworks: ['jasmine'], + + + // list of files / patterns to load in the browser + files: [], + + + // list of files to exclude + exclude: [ + ], + + // preprocess matching files before serving them to the browser + // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor + preprocessors: { + }, + + + // test results reporter to use + // possible values: 'dots', 'progress' + // available reporters: https://npmjs.org/browse/keyword/karma-reporter + reporters: ['progress'], + + + // web server port + port: 9876, + + + // enable / disable colors in the output (reporters and logs) + colors: true, + + + // level of logging + // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG + logLevel: config.LOG_INFO, + + + // enable / disable watching file and executing tests whenever any file changes + autoWatch: false, + + + // start these browsers + // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher + browsers: ['PhantomJS'], + + + // Continuous Integration mode + // if true, Karma captures browsers, runs the tests and exits + singleRun: true, + + // Concurrency level + // how many browser should be started simultaneous + concurrency: Infinity + }) +} diff --git a/package.json b/package.json new file mode 100644 index 0000000..731fbb3 --- /dev/null +++ b/package.json @@ -0,0 +1,32 @@ +{ + "name": "js_training", + "version": "1.0.0", + "description": "reposity for js training", + "main": "index.js", + "scripts": { + "start": "webpack-dev-server" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/tszewcow/js_training_initial.git" + }, + "author": "tszewcow", + "license": "ISC", + "bugs": { + "url": "https://github.com/tszewcow/js_training_initial/issues" + }, + "homepage": "https://github.com/tszewcow/js_training_initial#readme", + "devDependencies": { + "babel-core": "^6.24.1", + "babel-loader": "^6.4.1", + "babel-preset-es2015": "^6.24.1", + "jasmine-core": "^2.5.2", + "karma": "^1.6.0", + "karma-chrome-launcher": "^2.0.0", + "karma-jasmine": "^1.1.0", + "karma-phantomjs-launcher": "^1.0.4", + "phantomjs-prebuilt": "^2.1.14", + "webpack": "^2.4.1", + "webpack-dev-server": "^2.4.2" + } +} From 3c731498a330aaf081b8c1c1b94bf42c3bc4487d Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Thu, 20 Apr 2017 11:58:55 +0200 Subject: [PATCH 17/30] karma config updated (use chrome) --- karma.conf.js | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/karma.conf.js b/karma.conf.js index 51628a5..ae0d574 100644 --- a/karma.conf.js +++ b/karma.conf.js @@ -14,7 +14,10 @@ module.exports = function(config) { // list of files / patterns to load in the browser - files: [], + files: [ + 'test.js', + 'test.spec.js' + ], // list of files to exclude @@ -52,12 +55,12 @@ module.exports = function(config) { // start these browsers // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher - browsers: ['PhantomJS'], + browsers: ['Chrome'], // Continuous Integration mode // if true, Karma captures browsers, runs the tests and exits - singleRun: true, + singleRun: false, // Concurrency level // how many browser should be started simultaneous From f5660c34b8df1e8909054a6c3bbc20f522b47147 Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Thu, 20 Apr 2017 11:59:22 +0200 Subject: [PATCH 18/30] karma config updated (clear test files) --- karma.conf.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/karma.conf.js b/karma.conf.js index ae0d574..50193af 100644 --- a/karma.conf.js +++ b/karma.conf.js @@ -14,10 +14,7 @@ module.exports = function(config) { // list of files / patterns to load in the browser - files: [ - 'test.js', - 'test.spec.js' - ], + files: [], // list of files to exclude From 5689294d38c1bc77653738cd9cab33fef59340ee Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Thu, 20 Apr 2017 12:50:55 +0200 Subject: [PATCH 19/30] exercise 7 solution added --- karma.conf.js | 7 ++-- main.spec.js | 97 +++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 102 insertions(+), 2 deletions(-) create mode 100644 main.spec.js diff --git a/karma.conf.js b/karma.conf.js index 50193af..9a7ed5a 100644 --- a/karma.conf.js +++ b/karma.conf.js @@ -14,7 +14,10 @@ module.exports = function(config) { // list of files / patterns to load in the browser - files: [], + files: [ + 'main.js', + 'main.spec.js' + ], // list of files to exclude @@ -47,7 +50,7 @@ module.exports = function(config) { // enable / disable watching file and executing tests whenever any file changes - autoWatch: false, + autoWatch: true, // start these browsers diff --git a/main.spec.js b/main.spec.js new file mode 100644 index 0000000..5f9fe81 --- /dev/null +++ b/main.spec.js @@ -0,0 +1,97 @@ +describe('Person class tests', () => { + + let person; + const firstName = 'John'; + const lastName = 'Example'; + const accounts = [new Account(1500, 'EUR', 1234)]; + + + beforeEach(() => { + person = new Person(firstName, lastName, accounts); + }); + + it('should initialize new person object', () => { + // given when then + expect(person.firstName).toBe(firstName); + expect(person.lastName).toBe(lastName); + expect(person.accounts.length).toBe(1); + expect(person.accounts[0].balance).toBe(1500); + expect(person.accounts[0].currency).toBe('EUR'); + expect(person.accounts[0].number).toBe(1234); + }); + + it('should add account', () => { + // given + const account = new Account(200, 'EUR', 9999); + + // when + person.addAccount(account); + + // then + expect(person.accounts.length).toBe(2); + expect(person.accounts[1]).toEqual(account); + }); + + it('should introduce itself', () => { + // given when then + expect(person.sayHello()).toBe('Hi, my name is John Example and I have 2 bank account(s) with total balance 1700'); + }); + + it('should filter accounts with positive balance', () => { + // given + const account = new Account(-100, 'PLN', 1010); + + // when + person.addAccount(account); + const positiveAccounts = person.filterPositiveAccounts(); + + // then + expect(positiveAccounts.length = 2); + expect(positiveAccounts[0].balance).toBeGreaterThanOrEqual(0); + expect(positiveAccounts[1].balance).toBeGreaterThanOrEqual(0); + }); + + it('should find account by its number', () => { + // given + const accountNumber = 1234; + + // when + const foundAccount = person.findAccount(accountNumber); + + // then + expect(foundAccount.number).toBe(accountNumber); + }); + + it('should withdraw money', (done) => { + // given when + const promise = person.withdraw(1234, 200); + + // then + promise.then(() => { + expect(person.accounts[0].balance).toBe(1300); + done(); + }); + }); + + it('should not withdraw money when account not found', (done) => { + // given when + const promise = person.withdraw(5, 2000); + + // then + promise.catch((reason) => { + expect(reason).toBe('Incorrect account number'); + done(); + }); + }); + + it('should not withdraw money when there is not enough money on the account', (done) => { + // given when + const promise = person.withdraw(1234, 20000); + + // then + promise.catch((reason) => { + expect(reason).toBe('Not enough funds on account number 1234'); + done(); + }); + }); +}); \ No newline at end of file From 5cb40ee44acb295ba399d02f2ccfd753d85fcd61 Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Thu, 20 Apr 2017 17:21:41 +0200 Subject: [PATCH 20/30] testing on node exercise solved --- main.js | 7 +++++++ package.json | 8 ++++++++ tests/main-node.spec.js | 28 ++++++++++++++++++++++++++++ 3 files changed, 43 insertions(+) create mode 100644 tests/main-node.spec.js diff --git a/main.js b/main.js index b833f45..f30bc65 100644 --- a/main.js +++ b/main.js @@ -61,6 +61,13 @@ class Person { }; }; +if (typeof module !== 'undefined') { + module.exports = { + Person: Person, + Account: Account + } +} + const person = new Person('John', 'Example', [new Account(1500, 'EUR', 1)]); console.log(person.sayHello()); person.addAccount(new Account(-2500, 'EUR', 2)); diff --git a/package.json b/package.json index 731fbb3..287ce06 100644 --- a/package.json +++ b/package.json @@ -20,13 +20,21 @@ "babel-core": "^6.24.1", "babel-loader": "^6.4.1", "babel-preset-es2015": "^6.24.1", + "chai": "^3.5.0", "jasmine-core": "^2.5.2", "karma": "^1.6.0", "karma-chrome-launcher": "^2.0.0", + "karma-commonjs": "^1.0.0", + "karma-commonjs-preprocessor": "^0.1.1", "karma-jasmine": "^1.1.0", "karma-phantomjs-launcher": "^1.0.4", + "mocha": "^3.2.0", "phantomjs-prebuilt": "^2.1.14", + "watchify": "^3.9.0", "webpack": "^2.4.1", "webpack-dev-server": "^2.4.2" + }, + "dependencies": { + "bootstrap-css-only": "^3.3.7" } } diff --git a/tests/main-node.spec.js b/tests/main-node.spec.js new file mode 100644 index 0000000..9ada06a --- /dev/null +++ b/tests/main-node.spec.js @@ -0,0 +1,28 @@ +const chai = require('chai'); +const expect = chai.expect; // we are using the "expect" style of Chai +const Person = require('../main.js').Person; +const Account = require('../main.js').Account; + + +describe('Person class tests', () => { + + let person; + const firstName = 'John'; + const lastName = 'Example'; + const accounts = [new Account(1500, 'EUR', 1234)]; + + + beforeEach(() => { + person = new Person(firstName, lastName, accounts); + }); + + it('should initialize new person object', () => { + // given when then + expect(person.firstName).to.equal(firstName); + expect(person.lastName).to.equal(lastName); + expect(person.accounts.length).to.equal(1); + expect(person.accounts[0].balance).to.equal(1500); + expect(person.accounts[0].currency).to.equal('EUR'); + expect(person.accounts[0].number).to.equal(1234); + }); +}); \ No newline at end of file From 67a437bae23cb1e8197ea52c57b22e92d89311f8 Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Sat, 22 Apr 2017 11:38:21 +0200 Subject: [PATCH 21/30] js in the browser exercise solved --- atm.js | 47 +++++++++++++++++++++++++++++++++++++++++++++++ index.html | 27 +++++++++++++++++++++++++++ main.js | 18 ------------------ 3 files changed, 74 insertions(+), 18 deletions(-) create mode 100644 atm.js diff --git a/atm.js b/atm.js new file mode 100644 index 0000000..5a909be --- /dev/null +++ b/atm.js @@ -0,0 +1,47 @@ +const person = new Person('John', 'Example', [new Account(1500, 'EUR', 1), new Account(-2500, 'EUR', 2)]); + +const atm = (() => { + // add person name + document.querySelector('.card-title').innerHTML = `${person.firstName} ${person.lastName}`; + + // list person accounts + const card = document.querySelector('.card'); + + for (let account of person.accounts) { + const paragraph = document.createElement('p'); + const paragraphText = document.createTextNode(`Account Number: ${account.number}, Balance: `); + + paragraph.appendChild(paragraphText); + + const span = document.createElement('span'); + span.id = 'account' + account.number; + span.innerText = account.balance; + + paragraph.appendChild(span); + + card.appendChild(paragraph); + } + + return { + withdrawMoney: function () { + const number = +document.querySelector('#number').value; + const amount = +document.querySelector('#amount').value; + if (number && amount) { + person.withdraw(number, amount).then(() => { + document.querySelector(`span#account${number}`).innerHTML = +document.querySelector(`span#account${number}`).innerHTML - amount; + }).catch((reason) => console.warn(reason)); + } + }, + onInputChange: function(){ + const number = +document.querySelector('#number').value; + const amount = +document.querySelector('#amount').value; + const button = document.querySelector('button'); + + if (number > 0 && amount > 0){ + button.disabled = false; + } else { + button.disabled = true; + } + } + } +})(); \ No newline at end of file diff --git a/index.html b/index.html index 3790aa5..15874bc 100644 --- a/index.html +++ b/index.html @@ -13,13 +13,40 @@ +

JS Training

+ +
+
+

+
Accounts:
+
+
+ +
+ + + + + + + +
+
+ + \ No newline at end of file diff --git a/main.js b/main.js index f30bc65..b25c83f 100644 --- a/main.js +++ b/main.js @@ -67,21 +67,3 @@ if (typeof module !== 'undefined') { Account: Account } } - -const person = new Person('John', 'Example', [new Account(1500, 'EUR', 1)]); -console.log(person.sayHello()); -person.addAccount(new Account(-2500, 'EUR', 2)); -console.log(person.sayHello()); -console.log(person.filterPositiveAccounts()); - - -person.withdraw(1, 200) - .then(success => { - console.log(success); - console.log('------------------after successful withdrawal--------------------------') - console.log(person.sayHello()); - }) - .catch(error => console.warn(error)); - -person.withdraw(2, 200).catch(error => console.warn(error)); -person.withdraw(3, 500).catch(error => console.warn(error)); From 840ca1c5fc8b9d4dd4b0c5b2822469082e82f48a Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Sat, 22 Apr 2017 17:26:43 +0200 Subject: [PATCH 22/30] custom event exercise solved / progress bar shown --- atm.js | 38 ++++++++++++++++++++++++++++++++------ index.html | 12 ++++++++++-- 2 files changed, 42 insertions(+), 8 deletions(-) diff --git a/atm.js b/atm.js index 5a909be..390fa2e 100644 --- a/atm.js +++ b/atm.js @@ -3,7 +3,7 @@ const person = new Person('John', 'Example', [new Account(1500, 'EUR', 1), new A const atm = (() => { // add person name document.querySelector('.card-title').innerHTML = `${person.firstName} ${person.lastName}`; - + // list person accounts const card = document.querySelector('.card'); @@ -16,28 +16,54 @@ const atm = (() => { const span = document.createElement('span'); span.id = 'account' + account.number; span.innerText = account.balance; - + paragraph.appendChild(span); card.appendChild(paragraph); } + // progress bar handling + const container = document.querySelector('.container'); + const progress = document.querySelector('.progress'); + const button = document.querySelector('button'); + container.addEventListener('myEvent', (e) => { + progress.hidden = !e.detail.showProgress; + }); + return { withdrawMoney: function () { const number = +document.querySelector('#number').value; const amount = +document.querySelector('#amount').value; + + const event = new CustomEvent('myEvent', { + detail: { showProgress: true }, + bubbles: true + }); + + button.disabled = true; + button.dispatchEvent(event); + if (number && amount) { + event.detail.showProgress = false; + person.withdraw(number, amount).then(() => { document.querySelector(`span#account${number}`).innerHTML = +document.querySelector(`span#account${number}`).innerHTML - amount; - }).catch((reason) => console.warn(reason)); + + button.dispatchEvent(event); + button.disabled = false; + + }).catch((reason) => { + console.warn(reason); + button.dispatchEvent(event); + button.disabled = false; + }); } }, - onInputChange: function(){ + onInputChange: function () { const number = +document.querySelector('#number').value; const amount = +document.querySelector('#amount').value; - const button = document.querySelector('button'); - if (number > 0 && amount > 0){ + if (number > 0 && amount > 0) { button.disabled = false; } else { button.disabled = true; diff --git a/index.html b/index.html index 15874bc..7ed43c7 100644 --- a/index.html +++ b/index.html @@ -26,6 +26,12 @@

JS Training

+ +

@@ -35,10 +41,12 @@
Accounts:
- + - +
From 0480bc73ce4264c5ef7b6198dc9e21bf3c13e4e8 Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Sun, 23 Apr 2017 13:10:50 +0200 Subject: [PATCH 23/30] readme updated --- README.md | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index f37366b..0c02287 100644 --- a/README.md +++ b/README.md @@ -1 +1,14 @@ -"# js_training_initial" +# JS Training + +## Installation instruction + +1. Install git +2. Clone this repository +3. Chackout branch 0-initial (git checkout 0-initial) +4. Install node version manager +5. Install node 6.10.12 (nvm install 6.10.12) +6. In the repository directiory (with package.json file) - call npm install +7. Install karma globally - npm i -g karma-cli +8. Install mocha globally - npm i -g mocha + + From 3acc000ee3e5c0d2188d582766d977743700f93f Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Sun, 23 Apr 2017 13:22:39 +0200 Subject: [PATCH 24/30] gitignore / readme --- package.json | 3 --- webpack.config.js | 22 ++++++++++++++++++++++ 2 files changed, 22 insertions(+), 3 deletions(-) create mode 100644 webpack.config.js diff --git a/package.json b/package.json index 287ce06..de150db 100644 --- a/package.json +++ b/package.json @@ -24,13 +24,10 @@ "jasmine-core": "^2.5.2", "karma": "^1.6.0", "karma-chrome-launcher": "^2.0.0", - "karma-commonjs": "^1.0.0", - "karma-commonjs-preprocessor": "^0.1.1", "karma-jasmine": "^1.1.0", "karma-phantomjs-launcher": "^1.0.4", "mocha": "^3.2.0", "phantomjs-prebuilt": "^2.1.14", - "watchify": "^3.9.0", "webpack": "^2.4.1", "webpack-dev-server": "^2.4.2" }, diff --git a/webpack.config.js b/webpack.config.js new file mode 100644 index 0000000..aab2e7c --- /dev/null +++ b/webpack.config.js @@ -0,0 +1,22 @@ +module.exports = { + entry: './app', + output: { + path: '/build', + filename: 'bundle.js' + }, + module: { + loaders: [{ + test: /\.js$/, + loaders: 'babel-loader', + exclude: /node_modules/, + query: { + presets: ['es2015'] + } + }] + }, + devServer: { + port: 3000, + contentBase: './build', + inline: true + } +} \ No newline at end of file From 04f6116e988eb02b210b4e6de790246b3ef654c1 Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Mon, 24 Apr 2017 12:45:46 +0200 Subject: [PATCH 25/30] readme.md updated --- README.md | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/README.md b/README.md index 0c02287..fd257b2 100644 --- a/README.md +++ b/README.md @@ -4,11 +4,11 @@ 1. Install git 2. Clone this repository -3. Chackout branch 0-initial (git checkout 0-initial) +3. Checkout branch 0-initial (git checkout 0-initial) 4. Install node version manager -5. Install node 6.10.12 (nvm install 6.10.12) -6. In the repository directiory (with package.json file) - call npm install -7. Install karma globally - npm i -g karma-cli -8. Install mocha globally - npm i -g mocha - - +5. Install node 6.10.2 (nvm install 6.10.2) +6. Tell nvm to use installed node version (nvm use 6.10.2) +7. In the repository directiory (with package.json file) - call npm install +8. Install karma globally - npm i -g karma-cli +9. Install mocha globally - npm i -g mocha +10. Install yarn globally - npm i -g yarn From de7a684a12b12824aec1efd614f92ab2b2e2bfe7 Mon Sep 17 00:00:00 2001 From: Szewcow Tomasz Date: Thu, 27 Apr 2017 08:24:24 +0200 Subject: [PATCH 26/30] browser tests refactored --- main.spec.js | 13 +++++-------- 1 file changed, 5 insertions(+), 8 deletions(-) diff --git a/main.spec.js b/main.spec.js index 5f9fe81..31ceaee 100644 --- a/main.spec.js +++ b/main.spec.js @@ -1,13 +1,11 @@ describe('Person class tests', () => { - let person; const firstName = 'John'; const lastName = 'Example'; - const accounts = [new Account(1500, 'EUR', 1234)]; - + let person; beforeEach(() => { - person = new Person(firstName, lastName, accounts); + person = new Person(firstName, lastName, [new Account(1500, 'EUR', 1234)]); }); it('should initialize new person object', () => { @@ -34,7 +32,7 @@ describe('Person class tests', () => { it('should introduce itself', () => { // given when then - expect(person.sayHello()).toBe('Hi, my name is John Example and I have 2 bank account(s) with total balance 1700'); + expect(person.sayHello()).toBe('Hi, my name is John Example and I have 1 bank account(s) with total balance 1500'); }); it('should filter accounts with positive balance', () => { @@ -46,9 +44,8 @@ describe('Person class tests', () => { const positiveAccounts = person.filterPositiveAccounts(); // then - expect(positiveAccounts.length = 2); + expect(positiveAccounts.length = 1); expect(positiveAccounts[0].balance).toBeGreaterThanOrEqual(0); - expect(positiveAccounts[1].balance).toBeGreaterThanOrEqual(0); }); it('should find account by its number', () => { @@ -65,7 +62,7 @@ describe('Person class tests', () => { it('should withdraw money', (done) => { // given when const promise = person.withdraw(1234, 200); - + // then promise.then(() => { expect(person.accounts[0].balance).toBe(1300); From 2c1dc6a81439b053e2b116e898c8fb22b16fb655 Mon Sep 17 00:00:00 2001 From: tszewcow Date: Mon, 19 Feb 2018 21:57:39 +0100 Subject: [PATCH 27/30] repo update --- README.md | 20 +- index.html | 2 +- package-lock.json | 11149 ++++++++++++++++++++++++++++++++++++++++++++ package.json | 38 +- webpack.config.js | 21 +- 5 files changed, 11200 insertions(+), 30 deletions(-) create mode 100644 package-lock.json diff --git a/README.md b/README.md index fd257b2..7e7e93a 100644 --- a/README.md +++ b/README.md @@ -6,9 +6,21 @@ 2. Clone this repository 3. Checkout branch 0-initial (git checkout 0-initial) 4. Install node version manager -5. Install node 6.10.2 (nvm install 6.10.2) -6. Tell nvm to use installed node version (nvm use 6.10.2) +5. Install node 8.9.4 (nvm install 8.9.4) +6. Tell nvm to use installed node version (nvm use 8.9.4) 7. In the repository directiory (with package.json file) - call npm install -8. Install karma globally - npm i -g karma-cli -9. Install mocha globally - npm i -g mocha +8. Install karma globally - npm i -g karma-cli@1.0.1 +9. Install mocha globally - npm i -g mocha@5.0.0 10. Install yarn globally - npm i -g yarn + +## When on webpack branch: + +1. To run the app: "npm start" - app starts on port 3000 +2. To run karma tests: "karma start" + - use 'Chrome' in karma.conf.js browsers array to test in the Chrome browser + - use 'ChromeHeadless' in karma.conf.js browsers array to test in the headless version of Chrome +3. To run mocha tests: "mocha node" + +## Note +Since PhantomJS can't interpret es2015 without additional shims, the PhantomJS dependencies will be probably +dropped in favour of running Tests in the Headless Chrome \ No newline at end of file diff --git a/index.html b/index.html index 7ed43c7..afe028a 100644 --- a/index.html +++ b/index.html @@ -12,7 +12,7 @@ JS Training code - +