From ed3770e7085951802ece69fc62c12c513a8e6866 Mon Sep 17 00:00:00 2001 From: Jessica Date: Tue, 29 Nov 2016 07:34:11 -0800 Subject: [PATCH 1/4] added quote view but not showing --- build/index.html | 4 +-- src/app.js | 42 +++++++++++++++++++++++++------ src/app/views/application_view.js | 3 +++ src/app/views/quote_view.js | 17 +++++++++++++ 4 files changed, 56 insertions(+), 10 deletions(-) create mode 100644 src/app/views/quote_view.js diff --git a/build/index.html b/build/index.html index 79b1a0f..be6e439 100644 --- a/build/index.html +++ b/build/index.html @@ -26,8 +26,8 @@

Ada Trader

<%- symbol %>

$<%- price.toFixed(2) %>

- - + +
diff --git a/src/app.js b/src/app.js index cb932d5..d0a724c 100644 --- a/src/app.js +++ b/src/app.js @@ -1,6 +1,20 @@ import $ from 'jquery'; import _ from 'underscore'; import ApplicationView from 'app/views/application_view'; +import QuoteView from 'app/views/quote_view'; + +var quoteData = [ + { + symbol: 'HUMOR', + price: 100.00 + }, { + symbol: 'CLOTH', + price: 70.00 + }, { + symbol: 'ROCK', + price: 30.00 + } +]; const simulate = function(quote) { // Calculate a random price movement @@ -18,13 +32,25 @@ const simulate = function(quote) { }; $(document).ready(function() { - var appView = new ApplicationView({ - el: '#application' + var quoteTemplate = _.template($('#tmpl-quote-view').html()); + var quoteListElement = $('.quotes'); + var cardList = []; + quoteData.forEach(function(quote) { + var card = new QuoteView({ + quote: quote, + template: quoteTemplate + }); + cardList.push(card); + quoteListElement.append(card.render().$el); }); - - appView.render(); - - setInterval(function() { - // Call simulate() on each quote in the ApplicationView - }, 1000); }); + // var appView = new ApplicationView({ + // el: '#application' + // }); + // + // appView.render(); + + // setInterval(function() { + // // Call simulate() on each quote in the ApplicationView + // }, 1000); +// }); diff --git a/src/app/views/application_view.js b/src/app/views/application_view.js index 30b6d0f..d2b5aae 100644 --- a/src/app/views/application_view.js +++ b/src/app/views/application_view.js @@ -1,4 +1,7 @@ +import $ from 'jquery'; import Backbone from 'backbone'; +import _ from 'underscore'; +import QuoteView from 'app/views/quote_view'; const ApplicationView = Backbone.View.extend({ initialize: function() { diff --git a/src/app/views/quote_view.js b/src/app/views/quote_view.js new file mode 100644 index 0000000..9f4cad7 --- /dev/null +++ b/src/app/views/quote_view.js @@ -0,0 +1,17 @@ +import $ from 'jquery'; +import Backbone from 'backbone'; +import _ from 'underscore'; + +var QuoteView = Backbone.View.extend({ + initialize: function(options) { + this.quote = options.quote; + this.template = options.template; + }, + + render: function() { + var html = this.template({quote: this.quote}); + this.$el.html(html); + + return this; + } +}); From 314af542d2c592f00ee705c2ca4f5b02521d9bec Mon Sep 17 00:00:00 2001 From: Jessica Date: Tue, 29 Nov 2016 07:38:44 -0800 Subject: [PATCH 2/4] yay wave 1 complete --- build/index.html | 4 ++-- src/app/views/quote_view.js | 2 ++ 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/build/index.html b/build/index.html index be6e439..16c2b2c 100644 --- a/build/index.html +++ b/build/index.html @@ -23,9 +23,9 @@

Ada Trader

  • -

    <%- symbol %>

    +

    <%- quote.symbol %>

    -

    $<%- price.toFixed(2) %>

    +

    $<%- quote.price.toFixed(2) %>

    diff --git a/src/app/views/quote_view.js b/src/app/views/quote_view.js index 9f4cad7..b1dffed 100644 --- a/src/app/views/quote_view.js +++ b/src/app/views/quote_view.js @@ -15,3 +15,5 @@ var QuoteView = Backbone.View.extend({ return this; } }); + +export default QuoteView; From 49d89669c0d55d65deeadde35b8bffa0b0ce4e91 Mon Sep 17 00:00:00 2001 From: Jessica Date: Tue, 29 Nov 2016 08:01:05 -0800 Subject: [PATCH 3/4] wave 2 complete --- src/app.js | 24 +++++++----------------- src/app/views/application_view.js | 23 +++++++++++++++++++++-- 2 files changed, 28 insertions(+), 19 deletions(-) diff --git a/src/app.js b/src/app.js index d0a724c..9731a88 100644 --- a/src/app.js +++ b/src/app.js @@ -32,25 +32,15 @@ const simulate = function(quote) { }; $(document).ready(function() { - var quoteTemplate = _.template($('#tmpl-quote-view').html()); - var quoteListElement = $('.quotes'); - var cardList = []; - quoteData.forEach(function(quote) { - var card = new QuoteView({ - quote: quote, - template: quoteTemplate - }); - cardList.push(card); - quoteListElement.append(card.render().$el); + + var appView = new ApplicationView({ + el: $('#application'), + quoteData: quoteData }); -}); - // var appView = new ApplicationView({ - // el: '#application' - // }); - // - // appView.render(); + + appView.render(); // setInterval(function() { // // Call simulate() on each quote in the ApplicationView // }, 1000); -// }); +}); diff --git a/src/app/views/application_view.js b/src/app/views/application_view.js index d2b5aae..e077633 100644 --- a/src/app/views/application_view.js +++ b/src/app/views/application_view.js @@ -4,11 +4,30 @@ import _ from 'underscore'; import QuoteView from 'app/views/quote_view'; const ApplicationView = Backbone.View.extend({ - initialize: function() { + initialize: function(options) { + this.quoteData = options.quoteData; + + this.quoteTemplate = _.template($('#tmpl-quote-view').html()); + + this.listElement = this.$('.quotes'); + + this.cardList = []; + this.quoteData.forEach(function(quote) { + var card = new QuoteView({ + quote: quote, + template: this.quoteTemplate + }); + this.cardList.push(card); + }, this); }, render: function() { - this.$el.html('

    Hello World

    '); + this.listElement.empty(); + this.cardList.forEach(function(card) { + card.render(); + + this.listElement.append(card.$el); + }, this); return this; } From 3f2654609ccd1d0a8553e41a87769c424a99ad35 Mon Sep 17 00:00:00 2001 From: Jessica Date: Tue, 29 Nov 2016 11:21:23 -0800 Subject: [PATCH 4/4] wave 3 complete --- src/app/views/application_view.js | 3 ++- src/app/views/quote_view.js | 17 +++++++++++++++++ 2 files changed, 19 insertions(+), 1 deletion(-) diff --git a/src/app/views/application_view.js b/src/app/views/application_view.js index e077633..220e5d7 100644 --- a/src/app/views/application_view.js +++ b/src/app/views/application_view.js @@ -30,7 +30,8 @@ const ApplicationView = Backbone.View.extend({ }, this); return this; - } + }, + }); export default ApplicationView; diff --git a/src/app/views/quote_view.js b/src/app/views/quote_view.js index b1dffed..2073adf 100644 --- a/src/app/views/quote_view.js +++ b/src/app/views/quote_view.js @@ -13,7 +13,24 @@ var QuoteView = Backbone.View.extend({ this.$el.html(html); return this; + }, + + events: { + 'click .btn-sell': 'sellStock', + 'click .btn-buy': 'buyStock' + }, + + sellStock: function(event) { + this.quote.price -= 1; + this.render(); + + }, + + buyStock: function(event) { + this.quote.price += 1; + this.render(); } + }); export default QuoteView;