diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000..8eacd0d
Binary files /dev/null and b/.DS_Store differ
diff --git a/here/index.html b/here/index.html
new file mode 100644
index 0000000..57fcf37
--- /dev/null
+++ b/here/index.html
@@ -0,0 +1,18 @@
+
+
+
+
+
+
+
+
+
+
+
diff --git a/here/myapi.json b/here/myapi.json
new file mode 100644
index 0000000..a3c6c59
--- /dev/null
+++ b/here/myapi.json
@@ -0,0 +1,3 @@
+{
+ "music":[{"title":"the"}]
+}
diff --git a/images/division_bell.jpg b/images/the_division_bell.jpg
similarity index 100%
rename from images/division_bell.jpg
rename to images/the_division_bell.jpg
diff --git a/index.html b/index.html
deleted file mode 100644
index b82dcc4..0000000
--- a/index.html
+++ /dev/null
@@ -1,15 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
diff --git a/index/index.html b/index/index.html
new file mode 100644
index 0000000..282b132
--- /dev/null
+++ b/index/index.html
@@ -0,0 +1,53 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Home | Playlist
+
+
+
+
+
+
+
+
+
+
+

+
+
+
+
+
+
+
+
+
+
diff --git a/index/script.js b/index/script.js
new file mode 100644
index 0000000..a8b53bb
--- /dev/null
+++ b/index/script.js
@@ -0,0 +1,31 @@
+$( document ).ready( function() {
+$.ajax( {
+url: "https://lit-fortress-6467.herokuapp.com/object"
+} ).done( function( data ) {
+var arr = data.results;
+var int = [];
+
+// Data.results.reduce( function( acc, curr, i, arr ) {
+ while ( int.length < 3 ) {
+ var min = 0;
+ var max = arr.length;
+ var num = ( Math.floor( Math.random() * ( max - min ) ) );
+ if ( !( int.includes( arr[ num ] ) ) ) {
+ int.push( arr[ num ] );
+ }
+ }
+
+// }, 0 );
+int.forEach( function( f ) {
+
+ $( ".dickshoe Mcgees" ).append( `
+
+

+
+
+
+
+ ` );
+} );
+} );
+} );
diff --git a/index/style.css b/index/style.css
new file mode 100644
index 0000000..f020efd
--- /dev/null
+++ b/index/style.css
@@ -0,0 +1,88 @@
+@font-face {
+ font-family: AvenirNextLTPro-Regular;
+ src: url(../fonts/AvenirNextLTPro-Regular.otf);
+}
+
+* {
+ font-family: AvenirNextLTPro-Regular;
+}
+/* Splash page */
+.container-fluid {
+ width: 100vw;
+ height: 100vh;
+}
+
+.albums {
+ margin: 8% auto;
+ width: 50%;
+ height: 70%;
+}
+.album_item{
+ width: 200px;
+ margin: 10px auto 0px auto;
+}
+.album_img{
+ width: 100%;
+}
+
+.filter {
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ background-color: rgba(255, 255, 255, 0.5);
+}
+
+#tracks {
+ width: 50vw;
+ height: 100vh;
+ float: right;
+}
+
+#headerino {
+ height: 5%;
+ background-color: rgb(137, 138, 122);
+ border-bottom: 2px solid black;
+}
+
+#footerino {
+ height: auto;
+ color: white;
+ background-color: rgb(85, 85, 71);
+ bottom: 0px;
+ position: fixed;
+ width: 100vw;
+}
+
+#footerino h2 {
+ padding-top: .5%;
+ margin-left: 5%;
+}
+
+body {
+ background-color: rgb(240, 240, 240);
+}
+
+#right_side {
+ padding: 0;
+ height: 100vh;
+}
+
+.thing {
+ color: purple;
+ padding-top: 30%;
+ width: 50%;
+ margin: auto;
+}
+
+.thing input {
+ width: 50%;
+ height: 15%;
+ color: white;
+ background-color: rgb(40, 40, 28);
+}
+
+#left_side {
+ margin: 0;
+ padding: 0;
+ height: 100vh;
+}
diff --git a/select/script.js b/select/script.js
new file mode 100644
index 0000000..78b7f71
--- /dev/null
+++ b/select/script.js
@@ -0,0 +1,39 @@
+$( document ).ready( function() {
+ $.ajax( { url: "https://lit-fortress-6467.herokuapp.com/object" } ).done( function( data ) {
+
+ data.results.forEach( function( f ) {
+
+ $( ".album_lists" ).append( `
+
+

+
+ ` );
+ // ( "object" ).
+ } );
+ var f = data.results;
+ var hold = [];
+ $( "img" ).click( function() {
+ var findMe = $( this ).attr( "src" ).slice( 10 );
+ var thething = f.find( function( { cover_art } ) {
+ return cover_art === findMe;
+ } );
+ hold.push( thething );
+ $( ".track_list" ).append( `
+
+ ${thething.artist} : ${thething.title}
+
+
+
+` );
+ } );
+ $( "input[name=clear]" ).click( function() {
+ $( ".track_list" ).empty();
+ } );
+ $( "input[name=submit]" ).click( function() {
+ console.log( hold );
+ $.ajax( { method: "POST", url: "https://lit-fortress-6467.herokuapp.com/post", data: hold } ).done( function( data ) {
+ console.log( data );
+ } );
+ } );
+ } );
+} );
diff --git a/select/select.html b/select/select.html
new file mode 100644
index 0000000..f82506f
--- /dev/null
+++ b/select/select.html
@@ -0,0 +1,37 @@
+
+
+
+
+
+
+
+
+
+
+
+
+ Select | Playlist
+
+
+
+
+
+
click an album to add its tracks to the bin
+
+
+
+
+
+
+
diff --git a/select/style.css b/select/style.css
new file mode 100644
index 0000000..ac687e0
--- /dev/null
+++ b/select/style.css
@@ -0,0 +1,85 @@
+@font-face {
+ font-family: AvenirNextLTPro-Regular;
+ src: url(../fonts/AvenirNextLTPro-Regular.otf);
+}
+
+* {
+ font-family: AvenirNextLTPro-Regular;
+}
+/* Splash page */
+.container-fluid {
+ width: 100vw;
+ height: 100vh;
+}
+
+.album_lists {
+width: auto;
+height:100px;
+margin: 3vh 0 0 3vw;
+overflow: auto;
+overflow-x: auto;
+white-space: nowrap;
+}
+.album_item{
+ display: inline-block;
+ width: 150px;
+ margin-left: 10px;
+}
+.album_img{
+ width: 100px;
+}
+
+#tracks {
+ width: 50vw;
+ height: 100vh;
+ float: right;
+}
+.track_list{
+ margin: 4% auto 0 auto;
+ height: 30vh;
+ width:80%;
+ background-color: rgb(234,234,234);
+ border: 2px solid black;
+ overflow-y: scroll;
+}
+#button_div{
+ margin-left:10%;
+ margin-top: 5vh;
+}
+#button_div input{
+ color: white;
+ width: 200px;
+ height: 40px;
+ background-color: rgb(40,40,28);
+}
+
+#headish {
+ width: 100vw;
+ height: 15vh;
+ background-color: rgb(137, 138, 122)
+}
+#headish h2{
+ color: white;
+ font-weight: 100;
+ position: relative;
+ margin-top: 9vh;
+ margin-left: 2vw;
+}
+
+#footerish {
+ height: auto;
+ color: white;
+ background-color: rgb(137, 138, 122);
+ bottom: 0px;
+ position: fixed;
+ width: 100vw;
+}
+
+#footerish h2 {
+ padding-top: .5%;
+ margin-left: 5%;
+}
+
+body {
+ background-color: rgb(240, 240, 240);
+}