From d6ec92bc00719f20460c6b7311f3d056004cdc87 Mon Sep 17 00:00:00 2001 From: Roxanne Date: Mon, 11 Dec 2017 16:42:12 -0800 Subject: [PATCH 01/14] added correct files for views: --- src/views/quote_list_view.js | 6 ++++++ src/views/quote_view.js | 5 +++++ 2 files changed, 11 insertions(+) create mode 100644 src/views/quote_list_view.js create mode 100644 src/views/quote_view.js diff --git a/src/views/quote_list_view.js b/src/views/quote_list_view.js new file mode 100644 index 0000000..76cd402 --- /dev/null +++ b/src/views/quote_list_view.js @@ -0,0 +1,6 @@ +import Backbone from 'backbone'; +import QuoteView from './quote_view'; +import Quote from '../models/quote'; + + +export default QuoteListView; diff --git a/src/views/quote_view.js b/src/views/quote_view.js new file mode 100644 index 0000000..0350028 --- /dev/null +++ b/src/views/quote_view.js @@ -0,0 +1,5 @@ +import Backbone from 'backbone'; +import Quote from '../models/quote'; + + +export default QuoteView; From 2508597bbe671a114c39bfff857f3247f8ede26c Mon Sep 17 00:00:00 2001 From: Roxanne Date: Mon, 11 Dec 2017 17:26:38 -0800 Subject: [PATCH 02/14] adding template information --- src/app.js | 14 ++++++++ src/models/quote.js | 2 ++ src/views/quote_list_view.js | 67 ++++++++++++++++++++++++++++++++++++ src/views/quote_view.js | 23 +++++++++++++ 4 files changed, 106 insertions(+) diff --git a/src/app.js b/src/app.js index 03ec910..bbeef9a 100644 --- a/src/app.js +++ b/src/app.js @@ -1,11 +1,16 @@ import 'foundation-sites/dist/foundation.css'; import 'css/app.css'; + import $ from 'jquery'; +import _ from 'underscore'; import Simulator from 'models/simulator'; import QuoteList from 'collections/quote_list'; +import QuoteListView from './views/quote_list_view'; +let quoteTemplate; +const quoteList = new QuoteList(); const quoteData = [ { symbol: 'HUMOR', @@ -25,11 +30,20 @@ const quoteData = [ }, ]; + $(document).ready(function() { + quoteTemplate = _.template($('#quote-template').html()); const quotes = new QuoteList(quoteData); const simulator = new Simulator({ quotes: quotes, }); + const quoteListView = new QuoteListView({ + el: 'quotes', + model: quoteList, + template: quoteTemplate, + + }); + quoteListView.render(); simulator.start(); }); diff --git a/src/models/quote.js b/src/models/quote.js index 4fbf466..0d6fbc8 100644 --- a/src/models/quote.js +++ b/src/models/quote.js @@ -8,10 +8,12 @@ const Quote = Backbone.Model.extend({ buy() { // Implement this function to increase the price by $1.00 + this.price += 1; }, sell() { // Implement this function to decrease the price by $1.00 + this.price -= 1; }, }); diff --git a/src/views/quote_list_view.js b/src/views/quote_list_view.js index 76cd402..e4d01d8 100644 --- a/src/views/quote_list_view.js +++ b/src/views/quote_list_view.js @@ -2,5 +2,72 @@ import Backbone from 'backbone'; import QuoteView from './quote_view'; import Quote from '../models/quote'; +const QuoteListView = Backbone.View.extend({ + initialize(params){ + this.template = params.template; + + this.listenTo(this.model, 'update', this.render); + }, + events:{ + // 'click #add-new-task': 'addTask', + }, + updateStatusMessageFrom(messageHash){ + // const $statusMessage = this.$('#status-messages'); + // $statusMessage.empty(); + // Object.keys(messageHash).forEach((messageType)=>{ + // messageHash[messageType].forEach((message) =>{ + // $statusMessage.append(`
  • ${message}
  • `); + // }); + // }); + // $statusMessage.show(); + }, + updateStatusMessage(message){ + // this.updateStatusMessageFrom({ + // task: message, + // }); + }, + addQuote(event){ + event.preventDefault(); + const formData = this.getFormData(); + const newQuote = new Quote(formData); + if(newQuote.isValid()){ + this.model.add(newQuote); + this.clearFormData(); + this.updateStatusMessage(`${newQuote.get('quote_name')} Created!`); + }else{ + console.log('Something went wrong!'); + this.updateStatusMessageFrom(newQuote.validationError); + } + }, + clearFormData(){ + ['quote_name', 'assignee'].forEach((field) => { + this.$(`#add-quote-form input[name=${field}]`).val(''); + }); + }, + getFormData(){ + const quoteData = {}; + ['quote_name', 'assignee'].forEach((field) =>{ + const val = this.$(`#add-quote-form input[name=${field}]`).val(); + if (val !== ''){ + quoteData[field]=val; + } + }); + return quoteData; + }, + render(){ + // backbone has it worked out that when using jquery only searches within this specific view + this.$('#quotes').empty(); + this.model.each((quote) => { + const quoteView = new QuoteView({ + model: quote, + template: this.template, + tagName: 'li', + className: 'quote' + }); + this.$('#quotes').append(quoteView.render().$el); + }); + return this; + }, +}); export default QuoteListView; diff --git a/src/views/quote_view.js b/src/views/quote_view.js index 0350028..f95d951 100644 --- a/src/views/quote_view.js +++ b/src/views/quote_view.js @@ -1,5 +1,28 @@ import Backbone from 'backbone'; import Quote from '../models/quote'; +const QuoteView = Backbone.View.extend({ + initialize(params){ + this.template = params.template; + this.listenTo(this.model, 'change', this.render) + }, + render(){ + const compiledTemplate = this.template(this.model.toJSON()); + this.$el.html(compiledTemplate); + + return this; + }, + // events:{ + // 'click button.btn-buy': this.buyQuote(), + // 'click button.btn-sell': this.sellQuote(), + // }, + // buyQuote(event){ + // this.model.buy(); + // }, + // sellQuote(event){ + // this.model.sell(); + // }, + +}); export default QuoteView; From 4bfb794228e1f4d5dc293498b5e2e1c8e8c413d1 Mon Sep 17 00:00:00 2001 From: Roxanne Date: Tue, 12 Dec 2017 15:51:43 -0800 Subject: [PATCH 03/14] added trade model and market order collection with views --- src/app.js | 6 +++-- src/collections/market_order.js | 8 ++++++ src/models/quote.js | 6 +++-- src/models/trade.js | 12 +++++++++ src/views/market_order_view.js | 48 +++++++++++++++++++++++++++++++++ src/views/quote_list_view.js | 1 + src/views/quote_view.js | 24 +++++++++-------- src/views/trade_view.js | 28 +++++++++++++++++++ 8 files changed, 118 insertions(+), 15 deletions(-) create mode 100644 src/collections/market_order.js create mode 100644 src/models/trade.js create mode 100644 src/views/market_order_view.js create mode 100644 src/views/trade_view.js diff --git a/src/app.js b/src/app.js index bbeef9a..03a4e33 100644 --- a/src/app.js +++ b/src/app.js @@ -34,12 +34,14 @@ const quoteData = [ $(document).ready(function() { quoteTemplate = _.template($('#quote-template').html()); const quotes = new QuoteList(quoteData); + console.log(quotes); + console.log('those are quotes'); const simulator = new Simulator({ quotes: quotes, }); const quoteListView = new QuoteListView({ - el: 'quotes', - model: quoteList, + el: 'main', + model: quotes, template: quoteTemplate, }); diff --git a/src/collections/market_order.js b/src/collections/market_order.js new file mode 100644 index 0000000..57c9269 --- /dev/null +++ b/src/collections/market_order.js @@ -0,0 +1,8 @@ +import Backbone from 'backbone'; +import Trade from 'models/trade'; + +const MarketOrder = Backbone.Collection.extend({ + model: Trade, +}); + +export default MarketOrder; diff --git a/src/models/quote.js b/src/models/quote.js index 0d6fbc8..bfeabf0 100644 --- a/src/models/quote.js +++ b/src/models/quote.js @@ -8,12 +8,14 @@ const Quote = Backbone.Model.extend({ buy() { // Implement this function to increase the price by $1.00 - this.price += 1; + this.set('price', (this.get('price') + 1)); + return this; }, sell() { // Implement this function to decrease the price by $1.00 - this.price -= 1; + this.set('price', (this.get('price') - 1)); + return this; }, }); diff --git a/src/models/trade.js b/src/models/trade.js new file mode 100644 index 0000000..fc69308 --- /dev/null +++ b/src/models/trade.js @@ -0,0 +1,12 @@ +import Backbone from 'backbone'; + +const Trade = Backbone.Model.extend({ + defaults: { + symbol: 'UNDEF', + price: 0.00, + transaction: 'buy', + }, + +}); + +export default Trade; diff --git a/src/views/market_order_view.js b/src/views/market_order_view.js new file mode 100644 index 0000000..40a3577 --- /dev/null +++ b/src/views/market_order_view.js @@ -0,0 +1,48 @@ +import Backbone from 'backbone'; +import MarketOrder from './market_order'; +import Trade from '../models/trade'; + +const MarketOrderView = Backbone.View.extend({ + initialize(params){ + this.template = params.template; + + this.listenTo(this.model, 'update', this.render); + }, + events:{ + // 'click #add-new-task': 'addTask', + }, + updateStatusMessageFrom(messageHash){ + + }, + updateStatusMessage(message){ + + }, + addTrade(event){ + event.preventDefault(); + const newTrade = new Trade(); + if(newTrade.isValid()){ + this.model.add(newTrade); + this.updateStatusMessage(`${newTrade.get('symbol')} Created!`); + }else{ + console.log('Something went wrong!'); + this.updateStatusMessageFrom(newTrade.validationError); + } + }, + render(){ + + this.$('#trades').empty(); + this.model.each((trade) => { + const tradeView = new TradeView({ + model: trade, + template: this.template, + tagName: 'li', + className: 'trade' + }); + this.$('#trades').append(tradeView.render().$el); + }); + + return this; + }, +}); + +export default MarketOrderView; diff --git a/src/views/quote_list_view.js b/src/views/quote_list_view.js index e4d01d8..8bc062d 100644 --- a/src/views/quote_list_view.js +++ b/src/views/quote_list_view.js @@ -66,6 +66,7 @@ const QuoteListView = Backbone.View.extend({ }); this.$('#quotes').append(quoteView.render().$el); }); + return this; }, }); diff --git a/src/views/quote_view.js b/src/views/quote_view.js index f95d951..ac72319 100644 --- a/src/views/quote_view.js +++ b/src/views/quote_view.js @@ -10,19 +10,21 @@ const QuoteView = Backbone.View.extend({ render(){ const compiledTemplate = this.template(this.model.toJSON()); this.$el.html(compiledTemplate); - return this; }, - // events:{ - // 'click button.btn-buy': this.buyQuote(), - // 'click button.btn-sell': this.sellQuote(), - // }, - // buyQuote(event){ - // this.model.buy(); - // }, - // sellQuote(event){ - // this.model.sell(); - // }, + events:{ + 'click button.btn-buy': 'buyQuote', + 'click button.btn-sell': 'sellQuote', + }, + buyQuote(){ + console.log('banana'); + this.model.buy(); + return this; + }, + sellQuote(){ + this.model.sell(); + return this; + }, }); export default QuoteView; diff --git a/src/views/trade_view.js b/src/views/trade_view.js new file mode 100644 index 0000000..cc09e44 --- /dev/null +++ b/src/views/trade_view.js @@ -0,0 +1,28 @@ +import Backbone from 'backbone'; +import Trade from '../models/trade'; + +const TradeView = Backbone.View.extend({ + initialize(params){ + this.template = params.template; + + this.listenTo(this.model, 'change', this.render) + }, + render(){ + const compiledTemplate = this.template(this.model.toJSON()); + this.$el.html(compiledTemplate); + + return this; + }, + // events:{ + // 'click button.btn-buy': this.buyQuote(), + // 'click button.btn-sell': this.sellQuote(), + // }, + // buyQuote(event){ + // this.model.buy(); + // }, + // sellQuote(event){ + // this.model.sell(); + // }, + +}); +export default TradeView; From edaa613196f5a00dbfaa2e38e031ce0482de16ba Mon Sep 17 00:00:00 2001 From: Roxanne Date: Wed, 13 Dec 2017 10:12:09 -0800 Subject: [PATCH 04/14] got the trades to populate --- spec/collections/market_order.js | 0 spec/collections/quote_list.js | 0 spec/models/trade_spec.js | 31 +++++++++++++++++++++++++++++++ src/app.js | 20 ++++++++++++++++++++ src/models/quote.js | 2 ++ src/models/trade.js | 8 ++++++-- src/views/market_order_view.js | 31 ++++++++++++++++++++++++++----- src/views/quote_list_view.js | 23 ++++++++++++++--------- src/views/quote_view.js | 5 ++++- src/views/trade_view.js | 7 +++++++ 10 files changed, 110 insertions(+), 17 deletions(-) create mode 100644 spec/collections/market_order.js create mode 100644 spec/collections/quote_list.js create mode 100644 spec/models/trade_spec.js diff --git a/spec/collections/market_order.js b/spec/collections/market_order.js new file mode 100644 index 0000000..e69de29 diff --git a/spec/collections/quote_list.js b/spec/collections/quote_list.js new file mode 100644 index 0000000..e69de29 diff --git a/spec/models/trade_spec.js b/spec/models/trade_spec.js new file mode 100644 index 0000000..35dee22 --- /dev/null +++ b/spec/models/trade_spec.js @@ -0,0 +1,31 @@ +import Trade from 'models/trade'; + +describe('Trade spec', () => { + let trade; + beforeEach(() => { + quote = new Trade({ + symbol: 'HELLO', + price: 100.00, + }); + }); + + describe('defaults', () => { + it('increases the price by $1.00', () => { + const startPrice = quote.get('price'); + + quote.buy(); + + expect(quote.get('price')).toEqual(startPrice + 1.00); + }); + }); + + describe('Sell function', () => { + it('decreases the price by $1.00', () => { + const startPrice = quote.get('price'); + + trade.sell(); + + expect(trade.get('price')).toEqual(startPrice - 1.00); + }); + }); +}); diff --git a/src/app.js b/src/app.js index 03a4e33..6847eae 100644 --- a/src/app.js +++ b/src/app.js @@ -4,12 +4,20 @@ import 'css/app.css'; import $ from 'jquery'; import _ from 'underscore'; +import Backbone from 'backbone'; import Simulator from 'models/simulator'; import QuoteList from 'collections/quote_list'; import QuoteListView from './views/quote_list_view'; +import MarketOrder from 'collections/market_order'; +import MarketOrderView from './views/market_order_view'; let quoteTemplate; +let tradeTemplate; + +let hamRadio = {}; +hamRadio = _.extend(hamRadio, Backbone.Events); + const quoteList = new QuoteList(); const quoteData = [ { @@ -33,6 +41,8 @@ const quoteData = [ $(document).ready(function() { quoteTemplate = _.template($('#quote-template').html()); + tradeTemplate = _.template($('#trade-template').html()); + const quotes = new QuoteList(quoteData); console.log(quotes); console.log('those are quotes'); @@ -43,7 +53,17 @@ $(document).ready(function() { el: 'main', model: quotes, template: quoteTemplate, + hamRadio: hamRadio, + }); + const marketOrder = new MarketOrder(); + console.log(marketOrder); + console.log('that is the market order^^^^'); + const marketOrderView = new MarketOrderView({ + el:'main', + model: marketOrder, + template: tradeTemplate, + hamRadio: hamRadio, }); quoteListView.render(); diff --git a/src/models/quote.js b/src/models/quote.js index bfeabf0..d1356d2 100644 --- a/src/models/quote.js +++ b/src/models/quote.js @@ -9,12 +9,14 @@ const Quote = Backbone.Model.extend({ buy() { // Implement this function to increase the price by $1.00 this.set('price', (this.get('price') + 1)); + return this; }, sell() { // Implement this function to decrease the price by $1.00 this.set('price', (this.get('price') - 1)); + return this; }, }); diff --git a/src/models/trade.js b/src/models/trade.js index fc69308..af83a14 100644 --- a/src/models/trade.js +++ b/src/models/trade.js @@ -4,9 +4,13 @@ const Trade = Backbone.Model.extend({ defaults: { symbol: 'UNDEF', price: 0.00, - transaction: 'buy', + buy: true, }, - + // newTrade(model){ + // console.log(model); + // console.log('that is the model^^'); + // return this; + // }, }); export default Trade; diff --git a/src/views/market_order_view.js b/src/views/market_order_view.js index 40a3577..b5323c3 100644 --- a/src/views/market_order_view.js +++ b/src/views/market_order_view.js @@ -1,11 +1,14 @@ import Backbone from 'backbone'; -import MarketOrder from './market_order'; +import MarketOrder from '../collections/market_order'; +import TradeView from './trade_view' import Trade from '../models/trade'; const MarketOrderView = Backbone.View.extend({ initialize(params){ this.template = params.template; - + this.hamRadio = params.hamRadio; + this.listenTo(this.hamRadio, 'bought_quote', this.buyTrade); + this.listenTo(this.hamRadio, 'sold_quote', (this.sellTrade)); this.listenTo(this.model, 'update', this.render); }, events:{ @@ -17,9 +20,26 @@ const MarketOrderView = Backbone.View.extend({ updateStatusMessage(message){ }, - addTrade(event){ - event.preventDefault(); - const newTrade = new Trade(); + buyTrade(model){ + console.log(model); + console.log('this is the model'); + const newTrade = new Trade({symbol: model.attributes.symbol, price: model.attributes.price, buy: false}); + + if(newTrade.isValid()){ + this.model.add(newTrade); + this.updateStatusMessage(`${newTrade.get('symbol')} Created!`); + }else{ + console.log('Something went wrong!'); + this.updateStatusMessageFrom(newTrade.validationError); + } + return newTrade; + }, + sellTrade(model){ + console.log(model); + console.log('this is the model'); + const newTrade = new Trade({symbol: model.attributes.symbol, price: model.attributes.price}); + console.log(newTrade); + if(newTrade.isValid()){ this.model.add(newTrade); this.updateStatusMessage(`${newTrade.get('symbol')} Created!`); @@ -27,6 +47,7 @@ const MarketOrderView = Backbone.View.extend({ console.log('Something went wrong!'); this.updateStatusMessageFrom(newTrade.validationError); } + return newTrade; }, render(){ diff --git a/src/views/quote_list_view.js b/src/views/quote_list_view.js index 8bc062d..61f7435 100644 --- a/src/views/quote_list_view.js +++ b/src/views/quote_list_view.js @@ -5,10 +5,14 @@ import Quote from '../models/quote'; const QuoteListView = Backbone.View.extend({ initialize(params){ this.template = params.template; + this.hamRadio = params.hamRadio; this.listenTo(this.model, 'update', this.render); }, events:{ + + // this.listenTo(this.hamRadio, 'bought_quote', this.setModel); + // this.listenTo(this.hamRadio, 'sold_quote', this.setModel); // 'click #add-new-task': 'addTask', }, updateStatusMessageFrom(messageHash){ @@ -31,13 +35,13 @@ const QuoteListView = Backbone.View.extend({ const formData = this.getFormData(); const newQuote = new Quote(formData); if(newQuote.isValid()){ - this.model.add(newQuote); - this.clearFormData(); - this.updateStatusMessage(`${newQuote.get('quote_name')} Created!`); - }else{ - console.log('Something went wrong!'); - this.updateStatusMessageFrom(newQuote.validationError); - } + this.model.add(newQuote); + this.clearFormData(); + this.updateStatusMessage(`${newQuote.get('quote_name')} Created!`); + }else{ + console.log('Something went wrong!'); + this.updateStatusMessageFrom(newQuote.validationError); + } }, clearFormData(){ ['quote_name', 'assignee'].forEach((field) => { @@ -62,11 +66,12 @@ const QuoteListView = Backbone.View.extend({ model: quote, template: this.template, tagName: 'li', - className: 'quote' + className: 'quote', + hamRadio: this.hamRadio, }); this.$('#quotes').append(quoteView.render().$el); }); - + return this; }, }); diff --git a/src/views/quote_view.js b/src/views/quote_view.js index ac72319..2451344 100644 --- a/src/views/quote_view.js +++ b/src/views/quote_view.js @@ -4,7 +4,7 @@ import Quote from '../models/quote'; const QuoteView = Backbone.View.extend({ initialize(params){ this.template = params.template; - + this.hamRadio = params.hamRadio; this.listenTo(this.model, 'change', this.render) }, render(){ @@ -19,10 +19,13 @@ const QuoteView = Backbone.View.extend({ buyQuote(){ console.log('banana'); this.model.buy(); + this.hamRadio.trigger('sold_quote', this.model); return this; }, sellQuote(){ this.model.sell(); + this.hamRadio.trigger('bought_quote', this.model); + console.log(this.model); return this; }, diff --git a/src/views/trade_view.js b/src/views/trade_view.js index cc09e44..7d3a2ea 100644 --- a/src/views/trade_view.js +++ b/src/views/trade_view.js @@ -4,8 +4,10 @@ import Trade from '../models/trade'; const TradeView = Backbone.View.extend({ initialize(params){ this.template = params.template; + this.hamRadio = params.hamRadio; this.listenTo(this.model, 'change', this.render) + }, render(){ const compiledTemplate = this.template(this.model.toJSON()); @@ -13,6 +15,11 @@ const TradeView = Backbone.View.extend({ return this; }, + addTrade(event){ + console.log('peanut butter'); + this.model.newTrade(event); + return this; + }, // events:{ // 'click button.btn-buy': this.buyQuote(), // 'click button.btn-sell': this.sellQuote(), From c0d9ea78b9dd19b8869c9a519cf21ae1404d3a68 Mon Sep 17 00:00:00 2001 From: Roxanne Date: Wed, 13 Dec 2017 10:42:53 -0800 Subject: [PATCH 05/14] working with jasmine and finding it not to be as comprehensive as minitest --- spec/collections/market_order.js | 0 spec/collections/market_order_spec.js | 24 ++++++++++++++++++++++++ spec/collections/quote_list.js | 0 spec/collections/quote_list_spec.js | 24 ++++++++++++++++++++++++ spec/models/trade_spec.js | 27 ++++++++++----------------- 5 files changed, 58 insertions(+), 17 deletions(-) delete mode 100644 spec/collections/market_order.js create mode 100644 spec/collections/market_order_spec.js delete mode 100644 spec/collections/quote_list.js create mode 100644 spec/collections/quote_list_spec.js diff --git a/spec/collections/market_order.js b/spec/collections/market_order.js deleted file mode 100644 index e69de29..0000000 diff --git a/spec/collections/market_order_spec.js b/spec/collections/market_order_spec.js new file mode 100644 index 0000000..064e001 --- /dev/null +++ b/spec/collections/market_order_spec.js @@ -0,0 +1,24 @@ +import MarketOrder from 'collections/market_order'; + +describe('MarketOrder spec', () => { + let marketOrder; + beforeEach(() => { + marketOrder = new MarketOrder({ }); + }); + + describe('Instantiation', () => { + it('can be instantiated', () => { + + expect(marketOrder).toBeTruthy; + expect(marketOrder).toBeDefined; + }); + it('must have a model', () =>{ + expect(marketOrder.get('model')).toBeDefined; + // expect(marketOrder.get('model')).toEqual(Trade); + }); + // it('must be a type of MarketOrder', () =>{ + // expect(marketOrder). + // }); + }); + +}); diff --git a/spec/collections/quote_list.js b/spec/collections/quote_list.js deleted file mode 100644 index e69de29..0000000 diff --git a/spec/collections/quote_list_spec.js b/spec/collections/quote_list_spec.js new file mode 100644 index 0000000..97f5449 --- /dev/null +++ b/spec/collections/quote_list_spec.js @@ -0,0 +1,24 @@ +import QuoteList from 'collections/quote_list'; + +describe('QuoteList spec', () => { + let quoteList; + beforeEach(() => { + quoteList = new QuoteList({ }); + }); + + describe('Instantiation', () => { + it('can be instantiated', () => { + + expect(quoteList).toBeTruthy; + expect(quoteList).toBeDefined; + }); + it('must have a model', () =>{ + expect(quoteList.get('model')).toBeDefined; + // expect(marketOrder.get('model')).toEqual(Trade); + }); + // it('must be a type of MarketOrder', () =>{ + // expect(marketOrder). + // }); + }); + +}); diff --git a/spec/models/trade_spec.js b/spec/models/trade_spec.js index 35dee22..bfeff43 100644 --- a/spec/models/trade_spec.js +++ b/spec/models/trade_spec.js @@ -3,29 +3,22 @@ import Trade from 'models/trade'; describe('Trade spec', () => { let trade; beforeEach(() => { - quote = new Trade({ - symbol: 'HELLO', - price: 100.00, + trade = new Trade({ + }); }); describe('defaults', () => { - it('increases the price by $1.00', () => { - const startPrice = quote.get('price'); - - quote.buy(); - - expect(quote.get('price')).toEqual(startPrice + 1.00); + it('has a default buy', () => { + expect(trade.get('buy')).toBeTruthy; + }); + it('has a default price', () => { + expect(trade.get('buy')).toBeTruthy; + }); + it('has a default symbol', () => { + expect(trade.get('buy')).toBeTruthy; }); }); - describe('Sell function', () => { - it('decreases the price by $1.00', () => { - const startPrice = quote.get('price'); - - trade.sell(); - expect(trade.get('price')).toEqual(startPrice - 1.00); - }); - }); }); From d0ca971e6a96c7932ddbda75d24f80af4b8e56e2 Mon Sep 17 00:00:00 2001 From: Roxanne Date: Thu, 14 Dec 2017 13:36:20 -0800 Subject: [PATCH 06/14] got the select option menu to render, finally --- dist/index.html | 6 +- src/app.js | 41 ++++++++++-- src/collections/limit_order_list.js | 8 +++ src/models/limit_order.js | 10 +++ src/views/limit_order_list_view.js | 96 +++++++++++++++++++++++++++++ src/views/limit_order_view.js | 38 ++++++++++++ src/views/market_order_view.js | 2 +- src/views/quote_list_view.js | 25 +++++++- src/views/quote_view.js | 2 +- 9 files changed, 218 insertions(+), 10 deletions(-) create mode 100644 src/collections/limit_order_list.js create mode 100644 src/models/limit_order.js create mode 100644 src/views/limit_order_list_view.js create mode 100644 src/views/limit_order_view.js diff --git a/dist/index.html b/dist/index.html index 8a046fa..4231199 100644 --- a/dist/index.html +++ b/dist/index.html @@ -59,7 +59,7 @@

    Open Orders

    Order Entry Form

    - @@ -115,6 +115,10 @@

    <%- symbol %>

    + + diff --git a/src/app.js b/src/app.js index 6847eae..46d0c5c 100644 --- a/src/app.js +++ b/src/app.js @@ -8,12 +8,17 @@ import Backbone from 'backbone'; import Simulator from 'models/simulator'; import QuoteList from 'collections/quote_list'; +// import LimitOrder from 'models/LimitOrder'; import QuoteListView from './views/quote_list_view'; import MarketOrder from 'collections/market_order'; import MarketOrderView from './views/market_order_view'; +import LimitOrderList from './collections/limit_order_list'; +import LimitOrderListView from './views/limit_order_list_view'; let quoteTemplate; let tradeTemplate; +let orderTemplate; +let dropdownTemplate; let hamRadio = {}; hamRadio = _.extend(hamRadio, Backbone.Events); @@ -38,10 +43,24 @@ const quoteData = [ }, ]; +// const renderOrderDropdown = function renderOrderDropdown(event){ +// const dropdownElement = $('#dropdown'); +// console.log('banana'); +// dropdownElement.html(''); +// console.log(event); +// console.log('this is event'); +// event.forEach( (symbol) => { +// let generatedHTML = dropdownTemplate({symbol: symbol}); +// dropdownElement.append(generatedHTML); +// }); +// }; $(document).ready(function() { quoteTemplate = _.template($('#quote-template').html()); tradeTemplate = _.template($('#trade-template').html()); + orderTemplate = _.template($('#order-template').html()); + dropdownTemplate = _.template($('#dropdown-symbol').html()); + // hamRadio.listenTo(hamRadio, 'render_order_dropdown', renderOrderDropdown); const quotes = new QuoteList(quoteData); console.log(quotes); @@ -60,12 +79,24 @@ $(document).ready(function() { console.log(marketOrder); console.log('that is the market order^^^^'); const marketOrderView = new MarketOrderView({ - el:'main', - model: marketOrder, - template: tradeTemplate, - hamRadio: hamRadio, + el:'main', + model: marketOrder, + template: tradeTemplate, + hamRadio: hamRadio, + }); + + // const limitOrder = new LimitOrder(); + const limitOrderList = new LimitOrderList(); + console.log(limitOrderList); + console.log('limit order list up there^^^'); + const limitOrderListView = new LimitOrderListView({ + el:'#order-workspace', + model: limitOrderList, + template: orderTemplate, + // dropdownTemplate: dropdownTemplate, + hamRadio: hamRadio, }); - quoteListView.render(); + quoteListView.render(); simulator.start(); }); diff --git a/src/collections/limit_order_list.js b/src/collections/limit_order_list.js new file mode 100644 index 0000000..4efd51d --- /dev/null +++ b/src/collections/limit_order_list.js @@ -0,0 +1,8 @@ +import Backbone from 'backbone'; +import LimitOrder from 'models/limit_order'; + +const LimitOrderList = Backbone.Collection.extend({ + model: LimitOrder, +}); + +export default LimitOrderList; diff --git a/src/models/limit_order.js b/src/models/limit_order.js new file mode 100644 index 0000000..77aa58f --- /dev/null +++ b/src/models/limit_order.js @@ -0,0 +1,10 @@ +import Backbone from 'backbone'; + +const LimitOrder = Backbone.Model.extend({ + defaults: { + symbol: 'UNDEF', + price: 0.00, + buy: true, + } +}); +export default LimitOrder diff --git a/src/views/limit_order_list_view.js b/src/views/limit_order_list_view.js new file mode 100644 index 0000000..10ecd8a --- /dev/null +++ b/src/views/limit_order_list_view.js @@ -0,0 +1,96 @@ +import Backbone from 'backbone'; +import LimitOrder from '../models/limit_order'; +import TradeView from './trade_view'; +import QuoteListView from './quote_list_view'; +import LimitOrderList from '../collections/limit_order_list'; +import LimitOrderView from './limit_order_view'; + +const LimitOrderListView = Backbone.View.extend({ + initialize(params){ + console.log(params); + console.log('these are the params'); + this.template = params.template; + this.hamRadio = params.hamRadio; + this.dropdownTemplate = params.dropdownTemplate; + // debugger; + this.listenTo(this.hamRadio, 'render_order_dropdown', this.renderOrderDropdown); + console.log('toothbrush'); + console.log(this.hamRadio); + console.log(`this is hamRadio `); + // this.listenTo(this.hamRadio, 'order_purchase', '###some method goes here'); + // this.listenTo(this.hamRadio, 'order_sold', '###some method goes here'); + this.listenTo(this.model, 'update', this.render); + }, + events:{ + // 'click #add-new-task': 'addTask', + }, + updateStatusMessageFrom(messageHash){ + + }, + updateStatusMessage(message){ + + }, + // orderPurchase(model){ + // const newTrade = new Trade({symbol: model.attributes.symbol, price: model.attributes.price, buy: false}); + // + // if(newTrade.isValid()){ + // this.model.add(newTrade); + // this.updateStatusMessage(`${newTrade.get('symbol')} Created!`); + // }else{ + // console.log('Something went wrong!'); + // this.updateStatusMessageFrom(newTrade.validationError); + // } + // return newTrade; + // }, + // orderSold(model){ + // + // const limitOrder = new LimitOrder({symbol: model.attributes.symbol, price: model.attributes.price}); + // console.log(limitOrder); + // + // if(limitOrder.isValid()){ + // this.model.add(limitOrder); + // this.updateStatusMessage(`${limitOrder.get('symbol')} Created!`); + // }else{ + // console.log('Something went wrong!'); + // this.updateStatusMessageFrom(limitOrder.validationError); + // } + // return limitOrder; + // }, + render() { + + this.$('#orders').empty(); + console.log('This is the limit order view model:' + this.model); + // debugger + this.model.each((order) => { + console.log(order); + console.log(this.template); + const limitOrderView = new LimitOrderView({ + model: limitOrder, + template: this.template, + tagName: 'li', + className: 'order' + }); + this.$('#orders').prepend(limitOrderView.render().$el); + }); + + return this; + }, + renderOrderDropdown(symbols){ + // debugger; + this.$('#dropdown').empty(); + console.log(symbols); + console.log('this is event'); + + for( let symbol of symbols){ + // debugger + let optionSymbol = symbol; + + this.$('#dropdown').append(`` ); + }; + + return this; + }, + +}); + +export default LimitOrderListView diff --git a/src/views/limit_order_view.js b/src/views/limit_order_view.js new file mode 100644 index 0000000..51ad547 --- /dev/null +++ b/src/views/limit_order_view.js @@ -0,0 +1,38 @@ +import Backbone from 'backbone'; +import LimitOrder from '../models/limit_order'; + + +const LimitOrderView = Backbone.View.extend({ + initialize(params){ + // debugger + console.log(params); + this.template = params.template; + this.hamRadio = params.hamRadio; + this.listenTo(this.model, 'change', this.render); + }, + + render(){ + const compiledTemplate = this.template(this.model.toJSON()); + this.$el.html(compiledTemplate); + return this; + }, + // events:{ + // 'click button.btn-buy': 'buyQuote', + // 'click button.btn-sell': 'sellQuote', + // }, + // buyQuote(){ + // console.log('banana'); + // this.model.buy(); + // this.hamRadio.trigger('sold_quote', this.model); + // return this; + // }, + // sellQuote(){ + // this.model.sell(); + // this.hamRadio.trigger('bought_quote', this.model); + // console.log(this.model); + // return this; + // }, + +}); + +export default LimitOrderView; diff --git a/src/views/market_order_view.js b/src/views/market_order_view.js index b5323c3..406d9b1 100644 --- a/src/views/market_order_view.js +++ b/src/views/market_order_view.js @@ -59,7 +59,7 @@ const MarketOrderView = Backbone.View.extend({ tagName: 'li', className: 'trade' }); - this.$('#trades').append(tradeView.render().$el); + this.$('#trades').prepend(tradeView.render().$el); }); return this; diff --git a/src/views/quote_list_view.js b/src/views/quote_list_view.js index 61f7435..d521afb 100644 --- a/src/views/quote_list_view.js +++ b/src/views/quote_list_view.js @@ -6,8 +6,11 @@ const QuoteListView = Backbone.View.extend({ initialize(params){ this.template = params.template; this.hamRadio = params.hamRadio; - + // this.uniqueQuoteSymbols(); + // this.listenTo(this.model, 'change', this.uniqueQuoteSymbols); this.listenTo(this.model, 'update', this.render); + // this.listenTo(this.model, 'update', this.uniqueQuoteSymbols); + }, events:{ @@ -61,6 +64,7 @@ const QuoteListView = Backbone.View.extend({ render(){ // backbone has it worked out that when using jquery only searches within this specific view this.$('#quotes').empty(); + this.model.each((quote) => { const quoteView = new QuoteView({ model: quote, @@ -70,10 +74,27 @@ const QuoteListView = Backbone.View.extend({ hamRadio: this.hamRadio, }); this.$('#quotes').append(quoteView.render().$el); - }); + }); + this.uniqueQuoteSymbols(); return this; }, + uniqueQuoteSymbols(){ + // this.$('#quotes').empty(); + let quoteSymbols = []; + this.model.each((quote) => { + let symbol = quote.get('symbol'); + if( !quoteSymbols.includes(symbol)){ + quoteSymbols.push(symbol); + }; + }); + console.log('apples'); + // debugger; + this.hamRadio.trigger('render_order_dropdown', quoteSymbols); + console.log('jelly'); + return quoteSymbols; + }, + }); export default QuoteListView; diff --git a/src/views/quote_view.js b/src/views/quote_view.js index 2451344..85a54a2 100644 --- a/src/views/quote_view.js +++ b/src/views/quote_view.js @@ -5,7 +5,7 @@ const QuoteView = Backbone.View.extend({ initialize(params){ this.template = params.template; this.hamRadio = params.hamRadio; - this.listenTo(this.model, 'change', this.render) + this.listenTo(this.model, 'change', this.render); }, render(){ const compiledTemplate = this.template(this.model.toJSON()); From 52750d0a97cdeb745a5d98e71dc17dd2857fe651 Mon Sep 17 00:00:00 2001 From: Roxanne Date: Fri, 15 Dec 2017 11:58:44 -0800 Subject: [PATCH 07/14] The limit order view is currently working --- dist/index.html | 213 +++++++++++++++-------------- src/views/limit_order_list_view.js | 116 +++++++++++----- src/views/limit_order_view.js | 10 +- src/views/market_order_view.js | 30 ++-- src/views/quote_view.js | 1 + src/views/trade_view.js | 1 - 6 files changed, 205 insertions(+), 166 deletions(-) diff --git a/dist/index.html b/dist/index.html index 4231199..dd54dd8 100644 --- a/dist/index.html +++ b/dist/index.html @@ -1,124 +1,127 @@ - - Ada Trader - - - - - - -
    -
    -

    Ada Trader

    -
    - -
    - -
    - -
    -

    Quotes

    -
    -
      -
    -
    + + Ada Trader + + + + + + +
    +
    +

    Ada Trader

    +
    + +
    + +
    + +
    +

    Quotes

    +
    +
      +
    -
    -
    +
    -
    -

    Trade History

    -
    -
      -
    -
    -
    +
    +
    +

    Trade History

    +
    +
      +
    +
    +
    +
    + +
    -
    - -
    - -
    -
    -

    Open Orders

    -
    -
      -
    -
    -
    -
    - -
    -
    -

    Order Entry Form

    - - - - - - - - - -
    -
    -
    - -
    +
    +
    +
    +

    Open Orders

    +
    +
      +
    +
    +
    -
    -
    -
    - -
    -
    - - - - - - +
    + + + + + + - + - - + + diff --git a/src/views/limit_order_list_view.js b/src/views/limit_order_list_view.js index 10ecd8a..d8c365f 100644 --- a/src/views/limit_order_list_view.js +++ b/src/views/limit_order_list_view.js @@ -14,48 +14,56 @@ const LimitOrderListView = Backbone.View.extend({ this.dropdownTemplate = params.dropdownTemplate; // debugger; this.listenTo(this.hamRadio, 'render_order_dropdown', this.renderOrderDropdown); - console.log('toothbrush'); - console.log(this.hamRadio); - console.log(`this is hamRadio `); - // this.listenTo(this.hamRadio, 'order_purchase', '###some method goes here'); - // this.listenTo(this.hamRadio, 'order_sold', '###some method goes here'); + this.listenTo(this, 'order_purchase', this.addLimitOrder); + this.listenTo(this, 'order_sell', this.addLimitOrder); this.listenTo(this.model, 'update', this.render); }, events:{ - // 'click #add-new-task': 'addTask', + 'click form button.btn-buy': 'addLimitOrder', + 'click form button.btn-sell': 'addLimitOrder', }, - updateStatusMessageFrom(messageHash){ + updateStatusMessageFrom(messageHash) { + const $statusMessages = this.$('#status-messages'); + $statusMessages.empty(); + Object.keys(messageHash).forEach((messageType) => { + messageHash[messageType].forEach((message) => { + $statusMessages.append(`
  • ${message}
  • `); + }); + }); + $statusMessages.show(); + }, + updateStatusMessage(message) { + this.updateStatusMessageFrom({ + 'Limit Order': [message], + }); + }, + renderOrderPurchase(buyBoolean){ + console.log('banana nut bread'); + const newLimitOrder = new LimitOrder({symbol: model.attributes.symbol, price: model.attributes.price, buy: buyBoolean[buy]}); + if(newLimitOrder.isValid()){ + this.model.add(newLimitOrder); + this.updateStatusMessage(`${newLimitOrder.get('symbol')} Created!`); + }else{ + console.log('Something went wrong!'); + this.updateStatusMessageFrom(newLimitOrder.validationError); + } + return newTrade; }, - updateStatusMessage(message){ + renderOrderSale(){ + + const limitOrder = new LimitOrder({symbol: model.attributes.symbol, price: model.attributes.price}); + console.log(limitOrder); + if(limitOrder.isValid()){ + this.model.add(limitOrder); + this.updateStatusMessage(`${limitOrder.get('symbol')} Created!`); + }else{ + console.log('Something went wrong!'); + this.updateStatusMessageFrom(limitOrder.validationError); + } + return limitOrder; }, - // orderPurchase(model){ - // const newTrade = new Trade({symbol: model.attributes.symbol, price: model.attributes.price, buy: false}); - // - // if(newTrade.isValid()){ - // this.model.add(newTrade); - // this.updateStatusMessage(`${newTrade.get('symbol')} Created!`); - // }else{ - // console.log('Something went wrong!'); - // this.updateStatusMessageFrom(newTrade.validationError); - // } - // return newTrade; - // }, - // orderSold(model){ - // - // const limitOrder = new LimitOrder({symbol: model.attributes.symbol, price: model.attributes.price}); - // console.log(limitOrder); - // - // if(limitOrder.isValid()){ - // this.model.add(limitOrder); - // this.updateStatusMessage(`${limitOrder.get('symbol')} Created!`); - // }else{ - // console.log('Something went wrong!'); - // this.updateStatusMessageFrom(limitOrder.validationError); - // } - // return limitOrder; - // }, render() { this.$('#orders').empty(); @@ -65,7 +73,7 @@ const LimitOrderListView = Backbone.View.extend({ console.log(order); console.log(this.template); const limitOrderView = new LimitOrderView({ - model: limitOrder, + model: order, template: this.template, tagName: 'li', className: 'order' @@ -87,9 +95,45 @@ const LimitOrderListView = Backbone.View.extend({ this.$('#dropdown').append(`` ); }; - return this; }, + getFormData(){ + const orderData = {}; + const targetPrice = + this.$(`#create-order input`).val(); + if (targetPrice !== '') { + orderData['targetPrice'] = parseFloat(targetPrice); + }; + const targetSymbol = this.$( `#create-order select`).val(); + if (targetPrice !== '') { + orderData['symbol'] = targetSymbol; + }; + return orderData; + + }, + clearFormData() { + this.$(`#create-order input[name="price-target"]`).val(''); + }, + + addLimitOrder(event) { + event.preventDefault(); + console.log('cake'); + const formData = this.getFormData(); + // formData['buy'] = event['buy']; + const newLimitOrder = new LimitOrder(formData); + if (newLimitOrder.isValid()) { + this.model.add(newLimitOrder); + this.clearFormData(); + console.log(newLimitOrder); + console.log('that is a new limit order '); + this.updateStatusMessage(`${newLimitOrder.get('symbol')} Limit Order Created!`); + } + else { + console.log('ERROR'); + this.updateStatusMessageFrom(newTask.validationError); + newTask.destroy(); + } + }, }); diff --git a/src/views/limit_order_view.js b/src/views/limit_order_view.js index 51ad547..1a42a1b 100644 --- a/src/views/limit_order_view.js +++ b/src/views/limit_order_view.js @@ -12,14 +12,16 @@ const LimitOrderView = Backbone.View.extend({ }, render(){ + const compiledTemplate = this.template(this.model.toJSON()); + this.$el.html(compiledTemplate); return this; }, - // events:{ - // 'click button.btn-buy': 'buyQuote', - // 'click button.btn-sell': 'sellQuote', - // }, + events:{ + // 'click form button.btn-buy': 'order_purchase', + // 'click form button.btn-sell': 'order_sell', + }, // buyQuote(){ // console.log('banana'); // this.model.buy(); diff --git a/src/views/market_order_view.js b/src/views/market_order_view.js index 406d9b1..5622d12 100644 --- a/src/views/market_order_view.js +++ b/src/views/market_order_view.js @@ -7,8 +7,8 @@ const MarketOrderView = Backbone.View.extend({ initialize(params){ this.template = params.template; this.hamRadio = params.hamRadio; - this.listenTo(this.hamRadio, 'bought_quote', this.buyTrade); - this.listenTo(this.hamRadio, 'sold_quote', (this.sellTrade)); + this.listenTo(this.hamRadio, 'bought_quote', this.addTrade); + this.listenTo(this.hamRadio, 'sold_quote', (this.addTrade)); this.listenTo(this.model, 'update', this.render); }, events:{ @@ -20,25 +20,15 @@ const MarketOrderView = Backbone.View.extend({ updateStatusMessage(message){ }, - buyTrade(model){ - console.log(model); - console.log('this is the model'); - const newTrade = new Trade({symbol: model.attributes.symbol, price: model.attributes.price, buy: false}); - - if(newTrade.isValid()){ - this.model.add(newTrade); - this.updateStatusMessage(`${newTrade.get('symbol')} Created!`); - }else{ - console.log('Something went wrong!'); - this.updateStatusMessageFrom(newTrade.validationError); + addTrade(model){ + console.log(event); + console.log('thats the event'); + let tradeData = {symbol: model.attributes.symbol, price: model.attributes.price} + let btnSell = event['target'].classList.contains('btn-sell') + if( btnSell){ + tradeData['buy'] = false; } - return newTrade; - }, - sellTrade(model){ - console.log(model); - console.log('this is the model'); - const newTrade = new Trade({symbol: model.attributes.symbol, price: model.attributes.price}); - console.log(newTrade); + const newTrade = new Trade(tradeData); if(newTrade.isValid()){ this.model.add(newTrade); diff --git a/src/views/quote_view.js b/src/views/quote_view.js index 85a54a2..667486d 100644 --- a/src/views/quote_view.js +++ b/src/views/quote_view.js @@ -15,6 +15,7 @@ const QuoteView = Backbone.View.extend({ events:{ 'click button.btn-buy': 'buyQuote', 'click button.btn-sell': 'sellQuote', + }, buyQuote(){ console.log('banana'); diff --git a/src/views/trade_view.js b/src/views/trade_view.js index 7d3a2ea..96fa45a 100644 --- a/src/views/trade_view.js +++ b/src/views/trade_view.js @@ -16,7 +16,6 @@ const TradeView = Backbone.View.extend({ return this; }, addTrade(event){ - console.log('peanut butter'); this.model.newTrade(event); return this; }, From a5176f26197c54ae99df110bf5fe7bc90719961e Mon Sep 17 00:00:00 2001 From: Roxanne Date: Fri, 15 Dec 2017 12:13:33 -0800 Subject: [PATCH 08/14] now I log whether the market order is buy or sell --- src/views/limit_order_list_view.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/views/limit_order_list_view.js b/src/views/limit_order_list_view.js index d8c365f..38d62df 100644 --- a/src/views/limit_order_list_view.js +++ b/src/views/limit_order_list_view.js @@ -108,6 +108,10 @@ const LimitOrderListView = Backbone.View.extend({ if (targetPrice !== '') { orderData['symbol'] = targetSymbol; }; + let btnSell = event['target'].classList.contains('btn-sell') + if( btnSell){ + orderData['buy'] = false; + } return orderData; }, From eaf6add02875428319357a0c3681474d35ab1c9c Mon Sep 17 00:00:00 2001 From: Roxanne Date: Sun, 17 Dec 2017 23:45:55 -0800 Subject: [PATCH 09/14] orders can be deleted and purchase/sell quote --- src/views/limit_order_list_view.js | 38 ++++++++------------------ src/views/limit_order_view.js | 18 ++++-------- src/views/quote_view.js | 44 +++++++++++++++++++++++++++--- src/views/trade_view.js | 11 +++++--- 4 files changed, 64 insertions(+), 47 deletions(-) diff --git a/src/views/limit_order_list_view.js b/src/views/limit_order_list_view.js index 38d62df..f88a9fb 100644 --- a/src/views/limit_order_list_view.js +++ b/src/views/limit_order_list_view.js @@ -17,10 +17,12 @@ const LimitOrderListView = Backbone.View.extend({ this.listenTo(this, 'order_purchase', this.addLimitOrder); this.listenTo(this, 'order_sell', this.addLimitOrder); this.listenTo(this.model, 'update', this.render); + this.listenTo(this.model, 'deleteOrder', this.deleteOrder) }, events:{ 'click form button.btn-buy': 'addLimitOrder', 'click form button.btn-sell': 'addLimitOrder', + // 'click button.btn-cancel': 'cancelLimitOrder', }, updateStatusMessageFrom(messageHash) { const $statusMessages = this.$('#status-messages'); @@ -37,33 +39,7 @@ const LimitOrderListView = Backbone.View.extend({ 'Limit Order': [message], }); }, - renderOrderPurchase(buyBoolean){ - console.log('banana nut bread'); - const newLimitOrder = new LimitOrder({symbol: model.attributes.symbol, price: model.attributes.price, buy: buyBoolean[buy]}); - if(newLimitOrder.isValid()){ - this.model.add(newLimitOrder); - this.updateStatusMessage(`${newLimitOrder.get('symbol')} Created!`); - }else{ - console.log('Something went wrong!'); - this.updateStatusMessageFrom(newLimitOrder.validationError); - } - return newTrade; - }, - renderOrderSale(){ - - const limitOrder = new LimitOrder({symbol: model.attributes.symbol, price: model.attributes.price}); - console.log(limitOrder); - - if(limitOrder.isValid()){ - this.model.add(limitOrder); - this.updateStatusMessage(`${limitOrder.get('symbol')} Created!`); - }else{ - console.log('Something went wrong!'); - this.updateStatusMessageFrom(limitOrder.validationError); - } - return limitOrder; - }, render() { this.$('#orders').empty(); @@ -118,7 +94,10 @@ const LimitOrderListView = Backbone.View.extend({ clearFormData() { this.$(`#create-order input[name="price-target"]`).val(''); }, + cancelLimitOrder(event){ + console.log(event); + }, addLimitOrder(event) { event.preventDefault(); console.log('cake'); @@ -131,14 +110,19 @@ const LimitOrderListView = Backbone.View.extend({ console.log(newLimitOrder); console.log('that is a new limit order '); this.updateStatusMessage(`${newLimitOrder.get('symbol')} Limit Order Created!`); + this.hamRadio.trigger('add_listener', this.model); } else { console.log('ERROR'); this.updateStatusMessageFrom(newTask.validationError); newTask.destroy(); } + return this; + }, + deleteOrder() { + this.model.destroy(); + this.remove(); }, - }); export default LimitOrderListView diff --git a/src/views/limit_order_view.js b/src/views/limit_order_view.js index 1a42a1b..353ae32 100644 --- a/src/views/limit_order_view.js +++ b/src/views/limit_order_view.js @@ -19,21 +19,15 @@ const LimitOrderView = Backbone.View.extend({ return this; }, events:{ + 'click button.btn-cancel': 'cancelLimitOrder', // 'click form button.btn-buy': 'order_purchase', // 'click form button.btn-sell': 'order_sell', }, - // buyQuote(){ - // console.log('banana'); - // this.model.buy(); - // this.hamRadio.trigger('sold_quote', this.model); - // return this; - // }, - // sellQuote(){ - // this.model.sell(); - // this.hamRadio.trigger('bought_quote', this.model); - // console.log(this.model); - // return this; - // }, + cancelLimitOrder(){ + console.log('banana'); + this.model.destroy(); + }, + }); diff --git a/src/views/quote_view.js b/src/views/quote_view.js index 667486d..5d7b3e5 100644 --- a/src/views/quote_view.js +++ b/src/views/quote_view.js @@ -6,6 +6,8 @@ const QuoteView = Backbone.View.extend({ this.template = params.template; this.hamRadio = params.hamRadio; this.listenTo(this.model, 'change', this.render); + this.listenTo(this.hamRadio, 'add_listener', this.addListener); + // this.listenTo(this.model, 'update', ); }, render(){ const compiledTemplate = this.template(this.model.toJSON()); @@ -15,18 +17,52 @@ const QuoteView = Backbone.View.extend({ events:{ 'click button.btn-buy': 'buyQuote', 'click button.btn-sell': 'sellQuote', - + + }, + addListener(event){ + + let listOrderAttributes = event.models[0].attributes; + let thisSymbol = this.model.attributes.symbol; + let buyTrue = event.models[0].attributes['buy']; + let targetPrice = listOrderAttributes['targetPrice']; + if(listOrderAttributes['symbol'] == thisSymbol){ + console.log(' in the if statement and it matches'); + console.log(this); + console.log("inside addListener"); + this.listenTo(this.model, 'update', this.checkTargetPrice(targetPrice, buyTrue)); + } + return this; }, + checkTargetPrice(price, buy){ + debugger + let currentPrice = this.model.attributes.price; + console.log(currentPrice); + console.log('this price'); + if (buy == true){ + console.log('pie'); + if(currentPrice <= price){ + console.log('buying quote'); + this.buyQuote(); + this.trigger('deleteOrder'); + console.log('deleted Order'); + } + } else if (currentPrice >= price) { + console.log('selling quote'); + this.sellQuote(); + } + // return this; + }, + buyQuote(){ - console.log('banana'); + this.model.buy(); this.hamRadio.trigger('sold_quote', this.model); return this; }, sellQuote(){ this.model.sell(); - this.hamRadio.trigger('bought_quote', this.model); - console.log(this.model); + this.hamRadio.trigger('bought_quote', this.model); + console.log(this.model); return this; }, diff --git a/src/views/trade_view.js b/src/views/trade_view.js index 96fa45a..7063c1e 100644 --- a/src/views/trade_view.js +++ b/src/views/trade_view.js @@ -9,6 +9,9 @@ const TradeView = Backbone.View.extend({ this.listenTo(this.model, 'change', this.render) }, + events:{ + // 'click button.btn-cancel': 'cancelLimitOrder', + }, render(){ const compiledTemplate = this.template(this.model.toJSON()); this.$el.html(compiledTemplate); @@ -19,10 +22,10 @@ const TradeView = Backbone.View.extend({ this.model.newTrade(event); return this; }, - // events:{ - // 'click button.btn-buy': this.buyQuote(), - // 'click button.btn-sell': this.sellQuote(), - // }, + cancelLimitOrder(){ + this.model.destroy(); + } + // buyQuote(event){ // this.model.buy(); // }, From 011244d10f4169a1763116cea467ad5672cbff2e Mon Sep 17 00:00:00 2001 From: Roxanne Date: Tue, 19 Dec 2017 21:59:48 -0800 Subject: [PATCH 10/14] added some triggers to get Trade history. Update quote still not working --- src/app.js | 3 +- src/views/limit_order_list_view.js | 29 +++++++++++++++---- src/views/limit_order_view.js | 46 ++++++++++++++++++++++++++++-- src/views/quote_list_view.js | 16 +++++++++-- src/views/quote_view.js | 7 +++-- 5 files changed, 87 insertions(+), 14 deletions(-) diff --git a/src/app.js b/src/app.js index 46d0c5c..f38c5cf 100644 --- a/src/app.js +++ b/src/app.js @@ -23,7 +23,7 @@ let dropdownTemplate; let hamRadio = {}; hamRadio = _.extend(hamRadio, Backbone.Events); -const quoteList = new QuoteList(); +// const quoteList = new QuoteList(); const quoteData = [ { symbol: 'HUMOR', @@ -63,6 +63,7 @@ $(document).ready(function() { // hamRadio.listenTo(hamRadio, 'render_order_dropdown', renderOrderDropdown); const quotes = new QuoteList(quoteData); + console.log(quotes); console.log('those are quotes'); const simulator = new Simulator({ diff --git a/src/views/limit_order_list_view.js b/src/views/limit_order_list_view.js index f88a9fb..de00cf1 100644 --- a/src/views/limit_order_list_view.js +++ b/src/views/limit_order_list_view.js @@ -12,12 +12,11 @@ const LimitOrderListView = Backbone.View.extend({ this.template = params.template; this.hamRadio = params.hamRadio; this.dropdownTemplate = params.dropdownTemplate; - // debugger; this.listenTo(this.hamRadio, 'render_order_dropdown', this.renderOrderDropdown); this.listenTo(this, 'order_purchase', this.addLimitOrder); this.listenTo(this, 'order_sell', this.addLimitOrder); this.listenTo(this.model, 'update', this.render); - this.listenTo(this.model, 'deleteOrder', this.deleteOrder) + this.listenTo(this.hamRadio, 'deleteOrder', this.deleteOrder) }, events:{ 'click form button.btn-buy': 'addLimitOrder', @@ -102,7 +101,15 @@ const LimitOrderListView = Backbone.View.extend({ event.preventDefault(); console.log('cake'); const formData = this.getFormData(); - // formData['buy'] = event['buy']; + console.log(quotes); + const formSymbol = formData['symbol']; + + // const foundQuote = quotes.findWhere({ symbol: formData['symbol'] }); + // const foundQuote = quotes.find(function(model) { return model.get('symbol') === formData['symbol']; }); + + // console.log(foundQuote); + // console.log('here is my found quote'); + this.hamRadio.trigger('find_quote_model', formData); const newLimitOrder = new LimitOrder(formData); if (newLimitOrder.isValid()) { this.model.add(newLimitOrder); @@ -110,6 +117,7 @@ const LimitOrderListView = Backbone.View.extend({ console.log(newLimitOrder); console.log('that is a new limit order '); this.updateStatusMessage(`${newLimitOrder.get('symbol')} Limit Order Created!`); + this.hamRadio.trigger('add_listener', this.model); } else { @@ -119,9 +127,18 @@ const LimitOrderListView = Backbone.View.extend({ } return this; }, - deleteOrder() { - this.model.destroy(); - this.remove(); + deleteOrder(quote) { + debugger + let quoteName = quote.attributes.symbol; + let quotePrice = quote.attributes.price; + this.model.each((order) => { + if(order.attributes.symbol === quoteName && order.attributes.buy === true && quotePrice <= order.attributes.targetPrice|| order.attributes.symbol === quoteName && quoteBuy === false && quotePrice >= order.attributes.targetPrice){ + // this.$('#trades').prepend(tradeView.render().$el); + order.destroy(); + } + }); + + // this.remove(); }, }); diff --git a/src/views/limit_order_view.js b/src/views/limit_order_view.js index 353ae32..8353e2f 100644 --- a/src/views/limit_order_view.js +++ b/src/views/limit_order_view.js @@ -9,8 +9,15 @@ const LimitOrderView = Backbone.View.extend({ this.template = params.template; this.hamRadio = params.hamRadio; this.listenTo(this.model, 'change', this.render); + this.listenTo(this.model, 'update', this.checkTargetPrice); + this.listenTo(this.hamRadio, 'send_quote', this.addQuoteAttribute); + this.listenTo(this.model.attributes, 'update', this.checkTargetPrice); + }, + addQuoteAttribute(quoteModel){ + if(!this.quoteModel){ + debugger; + } }, - render(){ const compiledTemplate = this.template(this.model.toJSON()); @@ -19,16 +26,49 @@ const LimitOrderView = Backbone.View.extend({ return this; }, events:{ - 'click button.btn-cancel': 'cancelLimitOrder', + 'click button.btn-cancel': 'cancelLimitOrder', // 'click form button.btn-buy': 'order_purchase', // 'click form button.btn-sell': 'order_sell', }, cancelLimitOrder(){ - console.log('banana'); this.model.destroy(); }, + checkTargetPrice(){ + // + // let listOrderAttributes = this.attributes; + // let thisSymbol = this.attributes.symbol; + // let buyTrue = this.model.attributes['buy']; + // let targetPrice = listOrderAttributes['targetPrice']; + // if(listOrderAttributes['symbol'] == thisSymbol){ + // console.log(' in the if statement and it matches'); + // console.log(this); + // console.log("inside addListener"); + // debugger + // let currentPrice = this.model.attributes.targetPrice; + // console.log(currentPrice); + // console.log('this price'); + // if (buy == true){ + // console.log('pie'); + // if(currentPrice <= price){ + // console.log('buying quote'); + // this.buyQuote(); + // this.trigger('deleteOrder'); + // console.log('deleted Order'); + // } + // } else if (currentPrice >= price) { + // console.log('selling quote'); + // this.sellQuote(); + // } + // return this; + }, + addQuoteAttribute(quote){ + console.log('in add quote attribute'); + if(this.get('symbol') == quote.get('symbol')){ + this.quote = quote; + } + } }); export default LimitOrderView; diff --git a/src/views/quote_list_view.js b/src/views/quote_list_view.js index d521afb..a78dbf4 100644 --- a/src/views/quote_list_view.js +++ b/src/views/quote_list_view.js @@ -9,6 +9,7 @@ const QuoteListView = Backbone.View.extend({ // this.uniqueQuoteSymbols(); // this.listenTo(this.model, 'change', this.uniqueQuoteSymbols); this.listenTo(this.model, 'update', this.render); + this.listenTo(this.hamRadio, 'find_quote_model', this.findQuoteBySymbol); // this.listenTo(this.model, 'update', this.uniqueQuoteSymbols); }, @@ -79,6 +80,19 @@ const QuoteListView = Backbone.View.extend({ this.uniqueQuoteSymbols(); return this; }, + findQuoteBySymbol(quoteData){ + console.log('in findQuoteBySymbol'); + let foundQuote; + this.model.each((quote) => { + if(quote.get('symbol')=== quoteData['symbol']){ + foundQuote = quote + this.hamRadio.trigger('send_quote', quote) + // foundQuote.listenTo('update', ); + }; + }); + + return foundQuote; + }, uniqueQuoteSymbols(){ // this.$('#quotes').empty(); let quoteSymbols = []; @@ -88,10 +102,8 @@ const QuoteListView = Backbone.View.extend({ quoteSymbols.push(symbol); }; }); - console.log('apples'); // debugger; this.hamRadio.trigger('render_order_dropdown', quoteSymbols); - console.log('jelly'); return quoteSymbols; }, diff --git a/src/views/quote_view.js b/src/views/quote_view.js index 5d7b3e5..c9aea0a 100644 --- a/src/views/quote_view.js +++ b/src/views/quote_view.js @@ -7,6 +7,8 @@ const QuoteView = Backbone.View.extend({ this.hamRadio = params.hamRadio; this.listenTo(this.model, 'change', this.render); this.listenTo(this.hamRadio, 'add_listener', this.addListener); + // this.listenTo(this.model, 'limit_order', this.) + // this.listenTo(this.model, 'update', ); }, render(){ @@ -34,21 +36,22 @@ const QuoteView = Backbone.View.extend({ return this; }, checkTargetPrice(price, buy){ - debugger let currentPrice = this.model.attributes.price; console.log(currentPrice); console.log('this price'); + // debugger if (buy == true){ console.log('pie'); if(currentPrice <= price){ console.log('buying quote'); this.buyQuote(); - this.trigger('deleteOrder'); + this.hamRadio.trigger('deleteOrder', this.model); console.log('deleted Order'); } } else if (currentPrice >= price) { console.log('selling quote'); this.sellQuote(); + this.hamRadio.trigger('deleteOrder', this.model); } // return this; }, From 9414911fbd72142f817e938616a8e722ea83bf0d Mon Sep 17 00:00:00 2001 From: Roxanne Date: Tue, 19 Dec 2017 22:11:23 -0800 Subject: [PATCH 11/14] fixed bugs in deleteOrder and removed debugger --- src/views/limit_order_list_view.js | 3 ++- src/views/limit_order_view.js | 2 +- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/src/views/limit_order_list_view.js b/src/views/limit_order_list_view.js index de00cf1..d00c326 100644 --- a/src/views/limit_order_list_view.js +++ b/src/views/limit_order_list_view.js @@ -128,9 +128,10 @@ const LimitOrderListView = Backbone.View.extend({ return this; }, deleteOrder(quote) { - debugger + // debugger let quoteName = quote.attributes.symbol; let quotePrice = quote.attributes.price; + let quoteBuy = quote.attributes.buy; this.model.each((order) => { if(order.attributes.symbol === quoteName && order.attributes.buy === true && quotePrice <= order.attributes.targetPrice|| order.attributes.symbol === quoteName && quoteBuy === false && quotePrice >= order.attributes.targetPrice){ // this.$('#trades').prepend(tradeView.render().$el); diff --git a/src/views/limit_order_view.js b/src/views/limit_order_view.js index 8353e2f..ea421a1 100644 --- a/src/views/limit_order_view.js +++ b/src/views/limit_order_view.js @@ -11,7 +11,7 @@ const LimitOrderView = Backbone.View.extend({ this.listenTo(this.model, 'change', this.render); this.listenTo(this.model, 'update', this.checkTargetPrice); this.listenTo(this.hamRadio, 'send_quote', this.addQuoteAttribute); - this.listenTo(this.model.attributes, 'update', this.checkTargetPrice); + // this.listenTo(this.model.attributes.quote, 'update', this.checkTargetPrice); }, addQuoteAttribute(quoteModel){ if(!this.quoteModel){ From c012069ac74b0f23787dbd1f7b3123a758c54d6c Mon Sep 17 00:00:00 2001 From: Roxanne Date: Wed, 20 Dec 2017 09:02:40 -0800 Subject: [PATCH 12/14] added trigger to quote view and listener to order. added trigger to buyquote from order and listener in quote --- src/views/limit_order_list_view.js | 5 ++-- src/views/limit_order_view.js | 39 ++++++++++++++++++------------ src/views/market_order_view.js | 4 +-- src/views/quote_view.js | 14 ++++++----- 4 files changed, 36 insertions(+), 26 deletions(-) diff --git a/src/views/limit_order_list_view.js b/src/views/limit_order_list_view.js index d00c326..dbf37ea 100644 --- a/src/views/limit_order_list_view.js +++ b/src/views/limit_order_list_view.js @@ -16,7 +16,7 @@ const LimitOrderListView = Backbone.View.extend({ this.listenTo(this, 'order_purchase', this.addLimitOrder); this.listenTo(this, 'order_sell', this.addLimitOrder); this.listenTo(this.model, 'update', this.render); - this.listenTo(this.hamRadio, 'deleteOrder', this.deleteOrder) + this.listenTo(this.hamRadio, 'deleteOrder', this.deleteOrder); }, events:{ 'click form button.btn-buy': 'addLimitOrder', @@ -51,7 +51,8 @@ const LimitOrderListView = Backbone.View.extend({ model: order, template: this.template, tagName: 'li', - className: 'order' + className: 'order', + hamRadio: this.hamRadio, }); this.$('#orders').prepend(limitOrderView.render().$el); }); diff --git a/src/views/limit_order_view.js b/src/views/limit_order_view.js index ea421a1..abd6bf4 100644 --- a/src/views/limit_order_view.js +++ b/src/views/limit_order_view.js @@ -10,12 +10,10 @@ const LimitOrderView = Backbone.View.extend({ this.hamRadio = params.hamRadio; this.listenTo(this.model, 'change', this.render); this.listenTo(this.model, 'update', this.checkTargetPrice); - this.listenTo(this.hamRadio, 'send_quote', this.addQuoteAttribute); - // this.listenTo(this.model.attributes.quote, 'update', this.checkTargetPrice); + this.listenTo(this.hamRadio, 'update_price', this.checkTargetPrice); }, addQuoteAttribute(quoteModel){ if(!this.quoteModel){ - debugger; } }, render(){ @@ -33,14 +31,23 @@ const LimitOrderView = Backbone.View.extend({ cancelLimitOrder(){ this.model.destroy(); }, - checkTargetPrice(){ + checkTargetPrice(event){ + console.log('inside check target price'); + let thisSymbol = this.model.attributes.symbol; + let buyTrue = this.model.attributes.buy; + let targetPrice = this.model.attributes.targetPrice; + if(event['symbol'] == thisSymbol){ + if(buyTrue && event['price'] <= targetPrice){ + this.hamRadio.trigger(`buy_${thisSymbol}`); + this.model.destroy(); + console.log('destroyed order'); + }else if(!buyTrue && event['price'] >= targetPrice){ + this.hamRadio.trigger(`sell_${thisSymbol}`); + his.model.destroy(); + console.log('destroyed order'); + } - // - // let listOrderAttributes = this.attributes; - // let thisSymbol = this.attributes.symbol; - // let buyTrue = this.model.attributes['buy']; - // let targetPrice = listOrderAttributes['targetPrice']; - // if(listOrderAttributes['symbol'] == thisSymbol){ + }; // console.log(' in the if statement and it matches'); // console.log(this); // console.log("inside addListener"); @@ -63,12 +70,12 @@ const LimitOrderView = Backbone.View.extend({ // return this; }, - addQuoteAttribute(quote){ - console.log('in add quote attribute'); - if(this.get('symbol') == quote.get('symbol')){ - this.quote = quote; - } - } + // addQuoteAttribute(quote){ + // console.log('in add quote attribute'); + // if(this.get('symbol') == quote.get('symbol')){ + // this.quote = quote; + // } + // } }); export default LimitOrderView; diff --git a/src/views/market_order_view.js b/src/views/market_order_view.js index 5622d12..e73b0e1 100644 --- a/src/views/market_order_view.js +++ b/src/views/market_order_view.js @@ -24,8 +24,8 @@ const MarketOrderView = Backbone.View.extend({ console.log(event); console.log('thats the event'); let tradeData = {symbol: model.attributes.symbol, price: model.attributes.price} - let btnSell = event['target'].classList.contains('btn-sell') - if( btnSell){ + let btnSell = event['target'].classList.contains('btn-sell'); + if(btnSell){ tradeData['buy'] = false; } const newTrade = new Trade(tradeData); diff --git a/src/views/quote_view.js b/src/views/quote_view.js index c9aea0a..edeafcf 100644 --- a/src/views/quote_view.js +++ b/src/views/quote_view.js @@ -7,13 +7,16 @@ const QuoteView = Backbone.View.extend({ this.hamRadio = params.hamRadio; this.listenTo(this.model, 'change', this.render); this.listenTo(this.hamRadio, 'add_listener', this.addListener); - // this.listenTo(this.model, 'limit_order', this.) - - // this.listenTo(this.model, 'update', ); + this.listenTo(this.hamRadio, `buy_${this.model.attributes.symbol}`, this.buyQuote); + this.listenTo(this.hamRadio, `sell_${this.model.attributes.symbol}`, this.buyQuote); }, render(){ const compiledTemplate = this.template(this.model.toJSON()); this.$el.html(compiledTemplate); + let priceObject = {symbol: this.model.attributes.symbol, price: this.model.attributes.price} + console.log('in quote view render'); + this.hamRadio.trigger('update_price', priceObject); + return this; }, events:{ @@ -39,19 +42,18 @@ const QuoteView = Backbone.View.extend({ let currentPrice = this.model.attributes.price; console.log(currentPrice); console.log('this price'); - // debugger if (buy == true){ console.log('pie'); if(currentPrice <= price){ console.log('buying quote'); this.buyQuote(); - this.hamRadio.trigger('deleteOrder', this.model); + // this.hamRadio.trigger('deleteOrder', this.model); console.log('deleted Order'); } } else if (currentPrice >= price) { console.log('selling quote'); this.sellQuote(); - this.hamRadio.trigger('deleteOrder', this.model); + // this.hamRadio.trigger('deleteOrder', this.model); } // return this; }, From 00e51d36378569f6a4b0ea71d3fe09bf2bfc6cf3 Mon Sep 17 00:00:00 2001 From: Roxanne Agerone Date: Sun, 20 May 2018 13:36:44 -0700 Subject: [PATCH 13/14] made models more hip --- dist/index.html | 2 +- src/app.js | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/dist/index.html b/dist/index.html index dd54dd8..a7b86f0 100644 --- a/dist/index.html +++ b/dist/index.html @@ -10,7 +10,7 @@
    -

    Ada Trader

    +

    Crypto Trader

    diff --git a/src/app.js b/src/app.js index f38c5cf..16c7c6a 100644 --- a/src/app.js +++ b/src/app.js @@ -26,19 +26,19 @@ hamRadio = _.extend(hamRadio, Backbone.Events); // const quoteList = new QuoteList(); const quoteData = [ { - symbol: 'HUMOR', + symbol: 'ETHEREUM', price: 88.50, }, { - symbol: 'CLOTH', + symbol: 'ZCOIN', price: 81.70, }, { - symbol: 'HABIT', + symbol: 'BITCOIN', price: 98.00, }, { - symbol: 'SUPER', + symbol: 'LITECOIN', price: 83.10, }, ]; From 09799ee22955610a4952d0f9a66705896c9da3d1 Mon Sep 17 00:00:00 2001 From: Roxanne Agerone Date: Sun, 20 May 2018 13:42:53 -0700 Subject: [PATCH 14/14] added more info to the readme --- README.md | 38 ++++++++------------------------------ 1 file changed, 8 insertions(+), 30 deletions(-) diff --git a/README.md b/README.md index 5e9749c..3c44d2e 100644 --- a/README.md +++ b/README.md @@ -1,12 +1,10 @@ -# Ada Trader -In this project you will create the Ada Trader platform for real-time stock trading. All trading will happen with fake stocks that represent previous Ada capstone projects, and will be connected to a "real-time" simulation that randomly adjusts the prices for each stock over time. +# Crypto Trader -This is an individual, [stage 2](https://github.com/Ada-Developers-Academy/pedagogy/blob/master/rule-of-three.md) project. +This was a project with the aim of learning more about event handling. Stocks, or in this case cryptocurrencies, are updated every second. You can buy, sell, view your trade history, and set up automatic orders. -![Ada Trader](ada-trader.gif) ## Learning Goals -This project should demonstrate your ability to: +This project should demonstrates the ability to: - Create Backbone Views of Models - Create Backbone Views of Collections - Create multiple Backbone Models that relate to each other @@ -15,16 +13,17 @@ This project should demonstrate your ability to: - Create Model instances from the user input in that form - Test model logic in a Backbone application -Although real terminology is used throughout this project, and the interface design is intended to loosely mimic real-world trading platforms, having actual trading "domain knowledge" is **NOT** a learning goal. If you're unclear on any of the terminology used in this document please consult the [vocabulary section](#trading-vocabulary) for an explanation, or ask Charles / other instructional staff! ## Setup ### Starting project -To get started with the Ada Trader project follow these steps: +To get started with the Crypto Trader project follow these steps: 1. Fork and clone this repository 1. `cd` into the directory for your cloned project -1. `npm install` -1. `npm start` +``` +npm install +npm start +``` ### Project Baseline This project uses the same structure as BackTREK and is based on our [backbone baseline](https://github.com/AdaGold/backbone-baseline). The baseline for this project includes some models and collections that have already been implemented: @@ -147,24 +146,3 @@ Additionally, when: - Each order executes, in the same manner as though the user had clicked "Buy" on the quote - Each order is removed from the open order list - Each order will never execute again - -### Testing -You should have tests for any validations your models have, as well as any custom functions that you create on those models. **Optional**: Write a test which verifies that limit orders are executed and destroyed when the relevant stock reaches the order's target price. - -### Advice -Before you start working on this wave, set aside time with another Adie and make a diagram to explore the flow of events, and make a plan of action. Discuss with that person where the pieces of information currently exist, and how they can flow and propagate to where they need to be. - -To get the list of symbols for the order entry form's drop-down, you may need to give the View that controls the form access to the quote collection. - -When removing a Backbone View from the page, that does not mean that the associated Model is gone! Be careful when cancelling an order, because an order that isn't shown on the page might still "hear" events that are triggered. You may observe this bug if the trade history continues to update with transactions from "lingering" orders, even if the order is not rendered within the list of open orders. - -The rules above for when an order can or cannot be created are a great place to use Backbone's model validation system! Make sure to include tests for those validations as well. - -## Trading Vocabulary -| Term | Definition | -|:-----|:-----------| -| Market Order | An order to purchase or sell a particular stock at the "market" price. [More details here.](https://www.investopedia.com/terms/m/marketorder.asp) | -| Limit Order | An order to purchase or sell a particular stock at a trader-specified "target" price. [More details here.](https://www.investopedia.com/terms/l/limitorder.asp) | -| Market Price | The **current** price for a stock, listed with its symbol in the quote ticker. This price will change over time. | -| Target Price | The desired price for a limit order to execute. This price is higher than "market" price if the order is to sell, and it is lower than the "market" price if the order is to buy. This price is fixed for a given order. | -| Trade Price | The price that a stock was traded at (either buy or sell) for a given trade. This price is fixed because it represents an historical event. |