Delete method is working

models/album.js

@@ -1,2 +1,19 @@
 var mongoose = require("mongoose");
-var Schema = mongoose.Schema;
+var Song = require("./song");
+var AlbumSchema = mongoose.Schema({
+	artistName: String,
+	name: String,
+	releaseDate: String,
+	genres: [ String ],
+	description: String,
+	songs: [Song.schema]
+});
+
+var Album = mongoose.model('Album', AlbumSchema);
+
+module.exports = Album;
+
+
+
+
+

models/index.js

@@ -1,2 +1,6 @@
 var mongoose = require("mongoose");
-mongoose.connect("mongodb://localhost/tunely");
+var Album = require("./album");
+var Song = require("./song");
+// TODO: Whats up with the line below?
+// module.exports.Album = require('./album.js');
+mongoose.connect("mongodb://localhost/tunely");

models/song.js

@@ -0,0 +1,9 @@
+var mongoose = require("mongoose");
+var SongSchema = mongoose.Schema({
+	name: String,
+	trackNumber: Number
+});
+
+var Song = mongoose.model('Song', SongSchema);
+
+module.exports = Song;

package.json

@@ -17,6 +17,11 @@
   },
   "homepage": "https://github.com/tgaff/tunely#readme",
   "dependencies": {
-    "express": "^4.13.3"
+    "body-parser": "^1.15.0",
+    "ejs": "^2.4.1",
+    "express": "^4.13.3",
+    "method-override": "^2.3.4",
+    "mongoose": "^4.4.6",
+    "path": "^0.12.7"
   }
 }

public/js/app.js

@@ -5,53 +5,99 @@
  *
  */
 
-
-/* hard-coded data! */
-var sampleAlbums = [];
-sampleAlbums.push({
-             artistName: 'Ladyhawke',
-             name: 'Ladyhawke',
-             releaseDate: '2008, November 18',
-             genres: [ 'new wave', 'indie rock', 'synth pop' ]
-           });
-sampleAlbums.push({
-             artistName: 'The Knife',
-             name: 'Silent Shout',
-             releaseDate: '2006, February 17',
-             genres: [ 'synth pop', 'electronica', 'experimental' ]
-           });
-sampleAlbums.push({
-             artistName: 'Juno Reactor',
-             name: 'Shango',
-             releaseDate: '2000, October 9',
-             genres: [ 'electronic', 'goa trance', 'tribal house' ]
-           });
-sampleAlbums.push({
-             artistName: 'Philip Wesley',
-             name: 'Dark Night of the Soul',
-             releaseDate: '2008, September 12',
-             genres: [ 'piano' ]
-           });
-/* end of hard-coded data */
-
-
-
-
+//MAIN FUNCTION
 $(document).ready(function() {
-  console.log('app.js loaded!');
+  var $albums = $('#albums');
+
+
+  //this is the get call to occupy the index page with data from the db
+  $.ajax({
+    type: 'GET',
+    // we're pulling the data from our own api
+    url: '/api/albums',
+    // data here is the JSON of albums from '/api/albums'
+    success: function(data){
+      $.each(data.albums, function(i, album) {
+          renderAlbum(album);
+      });
+    },
+    error: function(err) {
+      alert("error loading " + err);
+    }
+  });
+
+  // DELETE method
+  $('#albums').delegate('.deleteBtn','click', function(){
+    // var $album = $(this).closest('.album');
+
+    var $albumId = $(this).attr('delete-album-id');
+
+    $.ajax({
+      type: 'DELETE',
+      url: '/api/albums/' + $albumId,
+      success: function(){
+        $('[data-album-id='+ $albumId + ']').remove();
+        console.log("YAY DELETE");
+      },
+      error: function(){
+        console.log("SOMETHING AINT WORKING");
+      }
+    });
+  });
+
+  // #singlebutton is the name of the submit button to make a new album
+  $('#singlebutton').on('click', function(event) {
+    event.preventDefault();
+
+    var $name = $('#name').val();
+    var $artistName = $('#artistName').val();
+    var $releaseDate = $('#releaseDate').val();
+    var $genres = $('#genres').val();
+    var $description = $('#description').val();
+
+    // here we grab the info from the form to make a new album and create
+    // a new object, newAlbum, with the input info
+    var newAlbum = {
+      name: $name, 
+      artistName: $artistName,
+      releaseDate: $releaseDate,
+      genres: $genres,
+      description: $description
+    };
+
+    $.ajax({
+      type: 'POST', 
+      url: '/api/albums',
+      data: newAlbum,
+      success: function(newAlbum){ 
+        renderAlbum(newAlbum);
+      },
+      error: function(err) {
+        alert("woah, hang on there a minute.  We've got an issue: " + err);
+      }
+    }); 
+  });
+
+//end of document ready
 });
 
 
 
 
-
 // this function takes a single album and renders it to the page
 function renderAlbum(album) {
-  console.log('rendering album:', album);
-
-  var albumHtml =
+  // This defines a songStr that we will fill with the name and track number of each song,
+  // we will then add this onto the end of the album information
+  var songStr = "";
+  // This loops through each song on the album and adds it to songStr
+  album.songs.forEach(function(song) {
+    songStr = songStr + "(" + song.trackNumber + ") " + song.name + " – ";
+  });
+
+  // albumTemplate is the layout for what will be rendered for new albums
+  var albumTemplate =
   "        <!-- one album -->" +
-  "        <div class='row album' data-album-id='" + "HARDCODED ALBUM ID" + "'>" +
+  "        <div class='row album' data-album-id='" + album._id + "'>" +
   "          <div class='col-md-10 col-md-offset-1'>" +
   "            <div class='panel panel-default'>" +
   "              <div class='panel-body'>" +
@@ -64,15 +110,20 @@ function renderAlbum(album) {
   "                    <ul class='list-group'>" +
   "                      <li class='list-group-item'>" +
   "                        <h4 class='inline-header'>Album Name:</h4>" +
-  "                        <span class='album-name'>" + "HARDCODED ALBUM NAME" + "</span>" +
+  "                        <span class='album-name'>" + album.name + "</span>" +
   "                      </li>" +
   "                      <li class='list-group-item'>" +
   "                        <h4 class='inline-header'>Artist Name:</h4>" +
-  "                        <span class='artist-name'>" + "HARDCODED ARTIST NAME" + "</span>" +
+  "                        <span class='artist-name'>" + album.artistName + "</span>" +
   "                      </li>" +
   "                      <li class='list-group-item'>" +
   "                        <h4 class='inline-header'>Released date:</h4>" +
-  "                        <span class='album-releaseDate'>" + "HARDCODED RELEASE DATE" + "</span>" +
+  "                        <span class='album-releaseDate'>" + album.releaseDate + "</span>" +
+  "                      </li>" +
+  "                      <li class='list-group-item'>" +
+  "                        <h4 class='inline-header'> Songs:</h4>" + 
+  "                        <span class='songsSpan'>" + songStr + "</span>" +
+  "                        <button class='songModalButton'> New Song </button>" +
   "                      </li>" +
   "                    </ul>" +
   "                  </div>" +
@@ -82,11 +133,105 @@ function renderAlbum(album) {
   "              </div>" + // end of panel-body
 
   "              <div class='panel-footer'>" +
+  "                 <div class='col-md-4'>" +
+  "                     <input id='delete-button' delete-album-id=" + album._id + " class='deleteBtn btn btn-primary' value='Delete' type='submit'></input>" +
+  "                  </div>" +
   "              </div>" +
 
   "            </div>" +
   "          </div>" +
   "          <!-- end one album -->";
 
-  // render to the page with jQuery
+
+      // getting album div in order to append the HTML
+      // var $albumDiv = $("#albums");
+
+      // $albumDiv.append(albumHtml);
+  // getting album div in order to append the HTML
+  // var $albumDiv = $("#albums");
+  // Here we are appending the above template with album info filled in
+  $("#albums").append(albumTemplate);
+
+
+  // var $songs = $(".songsSpan");
+
+  // var modalBtn = $(".songModalButton");
+  // $songs.delegate('.songModalButton', 'click', function() {
+  //   $(this).modal();
+  // });
+
+
+      // var $albumName = $(".album-name");
+      // var $artistName = $(".artist-name");
+      // var $albumReleaseDate = $(".album-releaseDate");
+
+      // var $deleteButton = "<input method='POST' action='/' type='submit' class='.btn-danger' value='Delete'></input>";
+
+      // $albumName.last().html(album.name);
+      // $artistName.last().html(album.artistName);
+      // $albumReleaseDate.last().html(album.releaseDate);
 }
+
+
+//this will build out our songs in each album and append it to the list
+
+// function buildSongsHtml (songs) {
+//   var songStr = "";
+
+//   // console.log(songs);
+//   songs.forEach(function(song) {
+//     songStr = songStr + "(" + song.trackNumber + ") " + song.name + "&ndash; ";
+//   });
+//     var songHtml =
+//       "<li class='list-group-item'>" +
+//         "<h4 class='inline-header'> Songs:</h4>" +
+//         "<span>" + songStr + "</span>" +
+//       "</li>";
+//     return songHtml;
+// }
+
+
+
+// function handleNewSongButtonClick(albums) {
+//   $('#albums').on('click', '.add-song', function(e) {
+
+//     var id= $(this).parents('.album').data('album-id'); // "5665ff1678209c64e51b4e7b"
+
+//     $('#songModal').attr('album-id', id);
+//     $('#songModal').modal();
+
+//     handleNewSongSubmit(albums, id);
+
+//   });
+// }
+
+
+// function handleNewSongSubmit(albums, id) {
+//   $('#saveSong').on('click', function(event) {
+//     event.preventDefault();
+
+//     var album = albums.filter(function(selectedAlbum){
+
+//       if(id == selectedAlbum._id){
+//         return selectedAlbum;
+//         // console.log(selectedAlbum._id);
+//       }
+//     });
+
+
+//     console.log(album[0].songs);
+
+
+//     var $songName = $("#songName").val();
+//     var $trackNumber = $("#trackNumber").val();
+
+//     var songObject = {
+//       name: $songName,
+//       trackNumber: $trackNumber
+//     };
+//     // console.log(songObject);
+//     // $.postJSON( "/api/albums", function( data ) {
+//       album[0].songs.push(songObject);
+//     // });
+//   });
+// }