From 8ce6c62133e61585c76c2c6e0de8ea21900e3d2a Mon Sep 17 00:00:00 2001 From: Bianca M Fernandez Date: Mon, 18 Dec 2017 14:42:31 -0800 Subject: [PATCH 01/17] Stubbing needed models, collections and views in app.js and created underscore template for movie --- dist/index.html | 37 ++++++++++++++++++++++++------------- src/app.js | 12 +++++++++++- src/models/movie.js | 0 3 files changed, 35 insertions(+), 14 deletions(-) create mode 100644 src/models/movie.js diff --git a/dist/index.html b/dist/index.html index 559b18ecd..835b1ba6c 100644 --- a/dist/index.html +++ b/dist/index.html @@ -1,15 +1,26 @@ - - - Backbone Baseline - - -
- -
- - - - - + + + Backbone Baseline + + +
+ +
+ +
+ +
+ + + + + + + diff --git a/src/app.js b/src/app.js index 30c00d594..69baf9a86 100644 --- a/src/app.js +++ b/src/app.js @@ -9,6 +9,16 @@ import _ from 'underscore'; // ready to go $(document).ready(function() { - $('#main-content').append('

Hello World!

'); + moviesLibraryTemplate = _.template($('#movies-library-template').html()); + + const movies = new MovieList;////NOTE/(API call data); + + const moviesLibraryView = new MoviesLibraryView({ + el: '', + model: movies, + template: moviesLibraryTemplate, + }); + + // $('#main-content').append('

Hello World!

'); }); diff --git a/src/models/movie.js b/src/models/movie.js new file mode 100644 index 000000000..e69de29bb From 278bcf6b49c4fe266849ff3c4abe76bc1607fa39 Mon Sep 17 00:00:00 2001 From: Bianca M Fernandez Date: Mon, 18 Dec 2017 15:12:34 -0800 Subject: [PATCH 02/17] Setting up views and models to import API information to show on front end - missing movie view --- dist/index.html | 7 +++++-- src/app.js | 15 +++++++++++---- src/collections/movie_list.js | 8 ++++++++ src/models/movie.js | 12 ++++++++++++ src/views/movies_library_view.js | 22 ++++++++++++++++++++++ src/views/movies_view.js | 10 ++++++++++ 6 files changed, 68 insertions(+), 6 deletions(-) create mode 100644 src/collections/movie_list.js create mode 100644 src/views/movies_library_view.js create mode 100644 src/views/movies_view.js diff --git a/dist/index.html b/dist/index.html index 835b1ba6c..197fba892 100644 --- a/dist/index.html +++ b/dist/index.html @@ -7,7 +7,10 @@
-
+
+
    + +
@@ -19,7 +22,7 @@

<%- title %>

<%- overview %>

<%- release_date %>

- " /> + " /> diff --git a/src/app.js b/src/app.js index 69baf9a86..3be41c479 100644 --- a/src/app.js +++ b/src/app.js @@ -6,19 +6,26 @@ import './css/styles.css'; import $ from 'jquery'; import _ from 'underscore'; +//MODELS AND COLLECTIONS +import Movie from './models/movie'; +import MovieList from './collections/movie_list'; + +//VIEWS +import MoviesView from './views/movies_view'; +import MoviesLibraryView from './views/movies_library_view'; + + // ready to go $(document).ready(function() { - moviesLibraryTemplate = _.template($('#movies-library-template').html()); + moviesLibraryTemplate = _.template($('#movie-template').html()); const movies = new MovieList;////NOTE/(API call data); const moviesLibraryView = new MoviesLibraryView({ - el: '', + el: '#movies-container', model: movies, template: moviesLibraryTemplate, }); - // $('#main-content').append('

Hello World!

'); - }); diff --git a/src/collections/movie_list.js b/src/collections/movie_list.js new file mode 100644 index 000000000..da15551f4 --- /dev/null +++ b/src/collections/movie_list.js @@ -0,0 +1,8 @@ +import Backbone from 'backbone'; + +const MovieList = Backbone.Collection.extend({ + model: Movie, +}) + + +export default MovieList diff --git a/src/models/movie.js b/src/models/movie.js index e69de29bb..d04081966 100644 --- a/src/models/movie.js +++ b/src/models/movie.js @@ -0,0 +1,12 @@ +import Backbone from 'backbone'; + +const Movie = Backbone.Model.extend({ + defaults: { + title: 'UNDEF', + overview: 'RANDOM', + release_date: '01-01-01', + image_url: 'bogus.jpg' + } +}); + +export default Movie diff --git a/src/views/movies_library_view.js b/src/views/movies_library_view.js new file mode 100644 index 000000000..61e6d03ec --- /dev/null +++ b/src/views/movies_library_view.js @@ -0,0 +1,22 @@ +import Backbone from 'backbone'; +import MovieList from '../collections/movie_list'; + +const MovieLibraryView = Backbone.View.extend({ + initialize(params){ + this.template = params.template; + }, + render(){ + this.model.each((movie) => { + const movieView = new MovieView({ + model: movie, + template: this.template, + className: 'movie', + tagName: 'li', + }); + this.$('#movies').append(movieView.render().$el); + }); + return this; + }, +}); + +export default MovieLibraryView diff --git a/src/views/movies_view.js b/src/views/movies_view.js new file mode 100644 index 000000000..77445826e --- /dev/null +++ b/src/views/movies_view.js @@ -0,0 +1,10 @@ +import Backbone from 'backbone'; +import Movie from '../models/movie'; + +const MovieView = Backbone.View.extend({ + initialize(params) { + this.template = params.template; + } +}); + +export default MovieView From fd9adbf9808d73a2d41023364178f54116326694 Mon Sep 17 00:00:00 2001 From: Angela Wilson Date: Mon, 18 Dec 2017 15:52:08 -0800 Subject: [PATCH 03/17] add movie_view render function --- dist/index.html | 2 +- src/app.js | 8 +++++--- src/collections/movie_list.js | 2 ++ src/views/movies_view.js | 5 +++++ 4 files changed, 13 insertions(+), 4 deletions(-) diff --git a/dist/index.html b/dist/index.html index 197fba892..db284cfbe 100644 --- a/dist/index.html +++ b/dist/index.html @@ -2,7 +2,7 @@ - Backbone Baseline + BiBi and Ang's BadAss Backbone Baseline
diff --git a/src/app.js b/src/app.js index 3be41c479..0569aec28 100644 --- a/src/app.js +++ b/src/app.js @@ -14,13 +14,15 @@ import MovieList from './collections/movie_list'; import MoviesView from './views/movies_view'; import MoviesLibraryView from './views/movies_library_view'; - +const movieList = new MovieList() // ready to go $(document).ready(function() { - moviesLibraryTemplate = _.template($('#movie-template').html()); + const moviesLibraryTemplate = _.template($('#movie-template').html()); + + movieList.fetch() - const movies = new MovieList;////NOTE/(API call data); + // const movies = new MovieList;////NOTE/(API call data); const moviesLibraryView = new MoviesLibraryView({ el: '#movies-container', diff --git a/src/collections/movie_list.js b/src/collections/movie_list.js index da15551f4..228395193 100644 --- a/src/collections/movie_list.js +++ b/src/collections/movie_list.js @@ -1,7 +1,9 @@ import Backbone from 'backbone'; +import Movie from '../models/movie' const MovieList = Backbone.Collection.extend({ model: Movie, + url: 'http://localhost:3000/movies' }) diff --git a/src/views/movies_view.js b/src/views/movies_view.js index 77445826e..6feaf082b 100644 --- a/src/views/movies_view.js +++ b/src/views/movies_view.js @@ -4,6 +4,11 @@ import Movie from '../models/movie'; const MovieView = Backbone.View.extend({ initialize(params) { this.template = params.template; + }, + render() { + const compileTemplate = this.template(this.model.toJSON()); + this.$el.html(compileTemplate); + return this; } }); From e48874cb5355b51d78667b62422dd9305f64c25c Mon Sep 17 00:00:00 2001 From: Angela Wilson Date: Mon, 18 Dec 2017 16:24:42 -0800 Subject: [PATCH 04/17] render rental library to DOM --- dist/index.html | 2 +- src/app.js | 11 +++++++---- src/views/{movies_view.js => movie_view.js} | 0 src/views/movies_library_view.js | 15 +++++++++++++-- 4 files changed, 21 insertions(+), 7 deletions(-) rename src/views/{movies_view.js => movie_view.js} (100%) diff --git a/dist/index.html b/dist/index.html index db284cfbe..ce98f5965 100644 --- a/dist/index.html +++ b/dist/index.html @@ -22,7 +22,7 @@

<%- title %>

<%- overview %>

<%- release_date %>

- " /> + diff --git a/src/app.js b/src/app.js index 0569aec28..a0c183cdb 100644 --- a/src/app.js +++ b/src/app.js @@ -11,18 +11,19 @@ import Movie from './models/movie'; import MovieList from './collections/movie_list'; //VIEWS -import MoviesView from './views/movies_view'; +import MovieView from './views/movie_view'; import MoviesLibraryView from './views/movies_library_view'; -const movieList = new MovieList() // ready to go $(document).ready(function() { const moviesLibraryTemplate = _.template($('#movie-template').html()); - movieList.fetch() - // const movies = new MovieList;////NOTE/(API call data); + + + const movies = new MovieList(); + movies.fetch() const moviesLibraryView = new MoviesLibraryView({ el: '#movies-container', @@ -30,4 +31,6 @@ $(document).ready(function() { template: moviesLibraryTemplate, }); + moviesLibraryView.render(); + }); diff --git a/src/views/movies_view.js b/src/views/movie_view.js similarity index 100% rename from src/views/movies_view.js rename to src/views/movie_view.js diff --git a/src/views/movies_library_view.js b/src/views/movies_library_view.js index 61e6d03ec..5f4f3f9ee 100644 --- a/src/views/movies_library_view.js +++ b/src/views/movies_library_view.js @@ -1,11 +1,18 @@ import Backbone from 'backbone'; import MovieList from '../collections/movie_list'; -const MovieLibraryView = Backbone.View.extend({ +// views +import MovieView from './movie_view' + +const MoviesLibraryView = Backbone.View.extend({ initialize(params){ this.template = params.template; + this.listenTo(this.model, 'update', this.render); }, render(){ + console.log(this); + console.log('this is this.model'); +console.log(this.model); this.model.each((movie) => { const movieView = new MovieView({ model: movie, @@ -13,10 +20,14 @@ const MovieLibraryView = Backbone.View.extend({ className: 'movie', tagName: 'li', }); + console.log("rendering movie view"); + console.log('this is movie = '); + console.log(movie); + console.log(this.template); this.$('#movies').append(movieView.render().$el); }); return this; }, }); -export default MovieLibraryView +export default MoviesLibraryView From 8d8aa98e7da80e193b5c7e575251db2eead4c522 Mon Sep 17 00:00:00 2001 From: Angela Wilson Date: Mon, 18 Dec 2017 16:51:04 -0800 Subject: [PATCH 05/17] add header for our app name in index.html and hide() all movies --- dist/index.html | 12 +++++++----- src/app.js | 1 + 2 files changed, 8 insertions(+), 5 deletions(-) diff --git a/dist/index.html b/dist/index.html index ce98f5965..a60c8d155 100644 --- a/dist/index.html +++ b/dist/index.html @@ -7,12 +7,14 @@
-
-
    +

    BiBi and Ang's BadAss Backbone Baseline

    +
    -
- -
+
+
    +
+
+
diff --git a/src/app.js b/src/app.js index a0c183cdb..224c5344a 100644 --- a/src/app.js +++ b/src/app.js @@ -25,6 +25,7 @@ $(document).ready(function() { const movies = new MovieList(); movies.fetch() + $('.movies-appear').hide() const moviesLibraryView = new MoviesLibraryView({ el: '#movies-container', model: movies, From 13dcb4f0cfc6106602b94997d7c4570986a46ece Mon Sep 17 00:00:00 2001 From: Bianca M Fernandez Date: Mon, 18 Dec 2017 18:24:22 -0800 Subject: [PATCH 06/17] Add images through underscore template --- dist/index.html | 10 +++++++++- src/app.js | 2 +- src/views/movies_view.js | 10 ++++++++++ 3 files changed, 20 insertions(+), 2 deletions(-) create mode 100644 src/views/movies_view.js diff --git a/dist/index.html b/dist/index.html index a60c8d155..7f16c1764 100644 --- a/dist/index.html +++ b/dist/index.html @@ -8,6 +8,14 @@

BiBi and Ang's BadAss Backbone Baseline

+
+ +
+ +
+ +
+
@@ -24,7 +32,7 @@

BiBi and Ang's BadAss Backbone Baseline

<%- title %>

<%- overview %>

<%- release_date %>

- + diff --git a/src/app.js b/src/app.js index 224c5344a..e75afe744 100644 --- a/src/app.js +++ b/src/app.js @@ -25,7 +25,7 @@ $(document).ready(function() { const movies = new MovieList(); movies.fetch() - $('.movies-appear').hide() + // $('.movies-appear').hide() const moviesLibraryView = new MoviesLibraryView({ el: '#movies-container', model: movies, diff --git a/src/views/movies_view.js b/src/views/movies_view.js new file mode 100644 index 000000000..77445826e --- /dev/null +++ b/src/views/movies_view.js @@ -0,0 +1,10 @@ +import Backbone from 'backbone'; +import Movie from '../models/movie'; + +const MovieView = Backbone.View.extend({ + initialize(params) { + this.template = params.template; + } +}); + +export default MovieView From bb6bd49a011efb6bfa69049759778486f6e63953 Mon Sep 17 00:00:00 2001 From: Bianca M Fernandez Date: Tue, 19 Dec 2017 11:04:28 -0800 Subject: [PATCH 07/17] Adding the search functionality in the jquery without adding additional views --- dist/index.html | 18 +++++++++++++++--- src/app.js | 28 ++++++++++++++++++++++++++++ src/css/styles.css | 8 +++++++- src/models/movie.js | 2 +- src/views/movie_view.js | 6 ++++++ src/views/movies_library_view.js | 12 ++++-------- src/views/movies_view.js | 10 ---------- 7 files changed, 61 insertions(+), 23 deletions(-) delete mode 100644 src/views/movies_view.js diff --git a/dist/index.html b/dist/index.html index 7f16c1764..db77ebfa9 100644 --- a/dist/index.html +++ b/dist/index.html @@ -9,11 +9,17 @@

BiBi and Ang's BadAss Backbone Baseline

-
-
+ + + +
+
+ + +
@@ -24,6 +30,9 @@

BiBi and Ang's BadAss Backbone Baseline

+ + +
@@ -32,8 +41,11 @@

BiBi and Ang's BadAss Backbone Baseline

<%- title %>

<%- overview %>

<%- release_date %>

- + + + + diff --git a/src/app.js b/src/app.js index e75afe744..265d635dd 100644 --- a/src/app.js +++ b/src/app.js @@ -26,6 +26,12 @@ $(document).ready(function() { movies.fetch() // $('.movies-appear').hide() + + // $('.view-library-btn').click(function() { + // console.log('in the view library button'); + // $('.movies-appear').toggle(); + // }); + const moviesLibraryView = new MoviesLibraryView({ el: '#movies-container', model: movies, @@ -34,4 +40,26 @@ $(document).ready(function() { moviesLibraryView.render(); + $('#movie-search-form').on('submit', function(event) { + event.preventDefault(); + // console.log(event); + let queryText = $('#query').val().trim(); + if (queryText.length > 0 ){ + movies.fetch({ + reset: true, + data: { query: queryText } + }); + } else { + movies.fetch(); + // movies.reset(); + } + + }); + + $('#movies-container').on('click', function(event){ + movies.fetch({ + reset: true + }); + }) + }); diff --git a/src/css/styles.css b/src/css/styles.css index 68a79a569..ebccacada 100644 --- a/src/css/styles.css +++ b/src/css/styles.css @@ -1,7 +1,7 @@ @include foundation-everything; main { - background: lightblue; + background: white; } header { @@ -37,6 +37,12 @@ aside label { div { display: inline; } + +ul { + list-style: none; +} + + /* * { border-style: solid; diff --git a/src/models/movie.js b/src/models/movie.js index d04081966..2fff31009 100644 --- a/src/models/movie.js +++ b/src/models/movie.js @@ -6,7 +6,7 @@ const Movie = Backbone.Model.extend({ overview: 'RANDOM', release_date: '01-01-01', image_url: 'bogus.jpg' - } + }, }); export default Movie diff --git a/src/views/movie_view.js b/src/views/movie_view.js index 6feaf082b..13d0a791b 100644 --- a/src/views/movie_view.js +++ b/src/views/movie_view.js @@ -9,6 +9,12 @@ const MovieView = Backbone.View.extend({ const compileTemplate = this.template(this.model.toJSON()); this.$el.html(compileTemplate); return this; + }, + events: { + 'click button.btn-add': 'add' + }, + add(event) { + this.model.save(); } }); diff --git a/src/views/movies_library_view.js b/src/views/movies_library_view.js index 5f4f3f9ee..49f40fe74 100644 --- a/src/views/movies_library_view.js +++ b/src/views/movies_library_view.js @@ -7,12 +7,11 @@ import MovieView from './movie_view' const MoviesLibraryView = Backbone.View.extend({ initialize(params){ this.template = params.template; - this.listenTo(this.model, 'update', this.render); + this.listenTo(this.model, 'update reset', this.render); }, render(){ - console.log(this); - console.log('this is this.model'); -console.log(this.model); + this.$('#movies').empty(); + this.model.each((movie) => { const movieView = new MovieView({ model: movie, @@ -20,10 +19,7 @@ console.log(this.model); className: 'movie', tagName: 'li', }); - console.log("rendering movie view"); - console.log('this is movie = '); - console.log(movie); - console.log(this.template); + this.$('#movies').append(movieView.render().$el); }); return this; diff --git a/src/views/movies_view.js b/src/views/movies_view.js deleted file mode 100644 index 77445826e..000000000 --- a/src/views/movies_view.js +++ /dev/null @@ -1,10 +0,0 @@ -import Backbone from 'backbone'; -import Movie from '../models/movie'; - -const MovieView = Backbone.View.extend({ - initialize(params) { - this.template = params.template; - } -}); - -export default MovieView From bccb69c47ab83899cfffd68ac574d61480c14944 Mon Sep 17 00:00:00 2001 From: Bianca M Fernandez Date: Tue, 19 Dec 2017 14:47:47 -0800 Subject: [PATCH 08/17] Basic add functionality --- dist/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dist/index.html b/dist/index.html index db77ebfa9..fac49affd 100644 --- a/dist/index.html +++ b/dist/index.html @@ -41,7 +41,7 @@

BiBi and Ang's BadAss Backbone Baseline

<%- title %>

<%- overview %>

<%- release_date %>

- + From 5484f3734b1acc710fd3048c252e4a95b7d99505 Mon Sep 17 00:00:00 2001 From: Angela Wilson Date: Tue, 19 Dec 2017 14:51:52 -0800 Subject: [PATCH 09/17] worked on styles --- dist/index.html | 34 +++++++++++++++++--------- src/collections/movie_DB_movie_list.js | 7 ++++++ src/css/styles.css | 16 ++++++++++-- src/models/movie_DB_movie.js | 7 ++++++ src/views/movie_DB_movie_list_view.js | 17 +++++++++++++ src/views/movie_DB_movie_view.js | 12 +++++++++ 6 files changed, 79 insertions(+), 14 deletions(-) create mode 100644 src/collections/movie_DB_movie_list.js create mode 100644 src/models/movie_DB_movie.js create mode 100644 src/views/movie_DB_movie_list_view.js create mode 100644 src/views/movie_DB_movie_view.js diff --git a/dist/index.html b/dist/index.html index db77ebfa9..d1ea0e28c 100644 --- a/dist/index.html +++ b/dist/index.html @@ -6,20 +6,30 @@
+
-

BiBi and Ang's BadAss Backbone Baseline

-
-
- - +

BiBi and Ang's BadAss Backbone Baseline

+
+
- + +
-
- - -
+
    + +
  • + +
  • + +
    +
  • +
  • +
  • +
@@ -38,10 +48,10 @@

BiBi and Ang's BadAss Backbone Baseline

diff --git a/src/collections/movie_DB_movie_list.js b/src/collections/movie_DB_movie_list.js new file mode 100644 index 000000000..342c56b46 --- /dev/null +++ b/src/collections/movie_DB_movie_list.js @@ -0,0 +1,7 @@ +import Backbone from 'backbone'; + +const MovieDbMovieList = Backbone.Collection.extend({ + +}); + +export default MovieDbMovieList diff --git a/src/css/styles.css b/src/css/styles.css index ebccacada..abdd68d47 100644 --- a/src/css/styles.css +++ b/src/css/styles.css @@ -5,8 +5,9 @@ main { } header { - background-color: lightgreen; - padding: 0.5rem; + background-color: gold; + padding: 40px; + margin-bottom: 10px; } #completed-checkbox { @@ -40,6 +41,17 @@ div { ul { list-style: none; + +} + + +script h2, script p, script button { + display: inline-block; + float: right; +} + +#search-form { + display: right; } diff --git a/src/models/movie_DB_movie.js b/src/models/movie_DB_movie.js new file mode 100644 index 000000000..0adafcb2c --- /dev/null +++ b/src/models/movie_DB_movie.js @@ -0,0 +1,7 @@ +import BackBone from 'backbone'; + +const MovieDbMovie = Backbone.Model.extend({ + +}); + +export default MovieDbMovie diff --git a/src/views/movie_DB_movie_list_view.js b/src/views/movie_DB_movie_list_view.js new file mode 100644 index 000000000..13d2539a2 --- /dev/null +++ b/src/views/movie_DB_movie_list_view.js @@ -0,0 +1,17 @@ +import Backbone from 'backbone'; + +const MovieDbMovieListView = Backbone.View.extend({ + this.template = params.template, + urlRoot: 'https://api.themoviedb.org/3/search/movie?api_key=f1bf8df60928b99ccf8a64792e64587f&query=thor' + }, + render() { + this.model.each((movie) => { + const movieDbMovieView = new MovieDbMovieView({ + model: movie, + template: this.template + }) + }) + } +}); + +export default MovieDbMovieListView diff --git a/src/views/movie_DB_movie_view.js b/src/views/movie_DB_movie_view.js new file mode 100644 index 000000000..4c00cb46b --- /dev/null +++ b/src/views/movie_DB_movie_view.js @@ -0,0 +1,12 @@ +import Backbone from 'backbone'; + +const MovieDbMovieView = Backbone.View.extend({ + initialize(params) { + urlRoot: 'https://api.themoviedb.org/3/search/movie?api_key=f1bf8df60928b99ccf8a64792e64587f&query=thor' + }, + render() { + this.model.each(()) + } +}); + +export default MovieDbMovieView From 3299ffe570a1032ff89f019f54fed3397afa067f Mon Sep 17 00:00:00 2001 From: Bianca M Fernandez Date: Tue, 19 Dec 2017 16:09:23 -0800 Subject: [PATCH 10/17] Add trigger to add event function --- src/views/movie_view.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/views/movie_view.js b/src/views/movie_view.js index 13d0a791b..37d651d8e 100644 --- a/src/views/movie_view.js +++ b/src/views/movie_view.js @@ -15,6 +15,7 @@ const MovieView = Backbone.View.extend({ }, add(event) { this.model.save(); + this.model.trigger('update'); } }); From 93e8dd22518c310956b78bf83756fe07e6cf9758 Mon Sep 17 00:00:00 2001 From: Angela Wilson Date: Tue, 19 Dec 2017 17:12:09 -0800 Subject: [PATCH 11/17] making styles --- dist/index.html | 4 ++-- src/css/star.jpg | Bin 0 -> 5329 bytes 2 files changed, 2 insertions(+), 2 deletions(-) create mode 100644 src/css/star.jpg diff --git a/dist/index.html b/dist/index.html index 496871b2f..b85311d86 100644 --- a/dist/index.html +++ b/dist/index.html @@ -12,7 +12,7 @@

BiBi and Ang's BadAss Backbone Baseline

- --> -
-
    +
    +
    +
      +
    • -
    • +
    • - - -
    • - - -
    • -
    +
  • + + +
  • +
+
diff --git a/src/app.js b/src/app.js index db0e5b277..c7155ae50 100644 --- a/src/app.js +++ b/src/app.js @@ -19,9 +19,6 @@ $(document).ready(function() { const moviesLibraryTemplate = _.template($('#movie-template').html()); - - - const movies = new MovieList(); // movies.fetch() @@ -29,8 +26,9 @@ $(document).ready(function() { $('.view-library-btn').click(function() { console.log('in the view library button'); - $('.movies-appear').show(); - movies.fetch() + movies.fetch({ + reset: true + }) }); const moviesLibraryView = new MoviesLibraryView({ @@ -57,10 +55,10 @@ $(document).ready(function() { }); - $('#movies-container').on('click', function(event){ - movies.fetch({ - reset: true - }); - }) + // $('#movies-container').on('click', function(event){ + // movies.fetch({ + // reset: true + // }); + // }) }); diff --git a/src/css/styles.css b/src/css/styles.css index 386fd9cdd..aa88e62c9 100644 --- a/src/css/styles.css +++ b/src/css/styles.css @@ -6,23 +6,40 @@ main { header { background-color: gold; - color: #9AC83A; + /*text-shadow: 2px 2px 2px 2px #88b824;*/ font-weight: bold; /*color: rgba(63,127,191, 1);*/ padding: 40px; margin-bottom: 10px; - background-image: url("popcorn.png") + background-image: url("popcorn.png"); + /*opacity: .2;*/ +} + +h1 { + color: #9AC83A; + /*opacity: 1;*/ } .button { background: #9AC83A; - + height: 60px; + width: auto; + font-size: 17px; + font-weight: 550; } + .button:hover { /*background: red;*/ background: #88b824; /*background: linear-gradient(top,#b0dc55,#88b824);*/ +} +.button:focus { + background: #9AC83A +} + +#query { + } #completed-checkbox { From 83b391e80a917d0f5fbdac06535cf7006c590c90 Mon Sep 17 00:00:00 2001 From: Angela Wilson Date: Tue, 19 Dec 2017 22:42:07 -0800 Subject: [PATCH 14/17] also add responsiveness --- src/css/styles.css | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/css/styles.css b/src/css/styles.css index aa88e62c9..30878c85e 100644 --- a/src/css/styles.css +++ b/src/css/styles.css @@ -28,10 +28,11 @@ h1 { font-weight: 550; } + .button:hover { /*background: red;*/ background: #88b824; - /*background: linear-gradient(top,#b0dc55,#88b824);*/ + background: linear-gradient(top,#b0dc55,#88b824); } .button:focus { From e478363fd510ad6053c3cf1ebc8952a2c913f6fe Mon Sep 17 00:00:00 2001 From: Angela Wilson Date: Tue, 19 Dec 2017 23:00:06 -0800 Subject: [PATCH 15/17] remove unused show method on movieLibraryView --- src/css/styles.css | 4 +++- src/views/movies_library_view.js | 9 --------- 2 files changed, 3 insertions(+), 10 deletions(-) diff --git a/src/css/styles.css b/src/css/styles.css index 30878c85e..aa830598a 100644 --- a/src/css/styles.css +++ b/src/css/styles.css @@ -26,13 +26,15 @@ h1 { width: auto; font-size: 17px; font-weight: 550; + margin-right: 7px; + margin-top: 10px; } .button:hover { /*background: red;*/ background: #88b824; - background: linear-gradient(top,#b0dc55,#88b824); + background-color: linear-gradient(top,#b0dc55,#88b824); } .button:focus { diff --git a/src/views/movies_library_view.js b/src/views/movies_library_view.js index c0d5e673d..49f40fe74 100644 --- a/src/views/movies_library_view.js +++ b/src/views/movies_library_view.js @@ -8,7 +8,6 @@ const MoviesLibraryView = Backbone.View.extend({ initialize(params){ this.template = params.template; this.listenTo(this.model, 'update reset', this.render); - this.listenTo(this.model, 'click', this.show) }, render(){ this.$('#movies').empty(); @@ -25,14 +24,6 @@ const MoviesLibraryView = Backbone.View.extend({ }); return this; }, - events: { - 'click button.view-library-btn': 'show' - }, - show() { - console.log('I am in show()'); - this.model.trigger('click') - this.$('#movies-container').show() - } }); export default MoviesLibraryView From a422f53e1d2f0d076955e31d4bfd028e6fe82946 Mon Sep 17 00:00:00 2001 From: Angela Wilson Date: Wed, 20 Dec 2017 10:42:58 -0800 Subject: [PATCH 16/17] delete 'Search for Movies' button --- dist/index.html | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/dist/index.html b/dist/index.html index 844729342..5eec3a47f 100644 --- a/dist/index.html +++ b/dist/index.html @@ -27,9 +27,7 @@

BiBi and Ang's BadAss Backbone Baseline

    -
  • - -
  • +
  • @@ -55,7 +53,7 @@

    BiBi and Ang's BadAss Backbone Baseline