Skip to content

Installation and Configuration (Testing)

Jump to bottom
Akshat edited this page Jun 25, 2018 · 2 revisions

Setup Instructions

  • Clone this project repository in a local directory.
  • Open Intellij WebStorm.

  • Click on open project and select the WebDev-Project-react folder that you cloned earlier.

  • Click on npm install prompt to install all the project dependencies OR if no prompt is shown, open terminal/cmd and navigate to the project directory and run the 'npm install' command to load all dependecies.

  • Run the 'npm start' from terminal/cmd at project to load the react application on port 3000.

Schema Creation and Running

  • The application is already configured and connected to a heroku hosted MongoDB database and the following users are already inserted in the database for you convenience:
  1. username: alice, password: alice, userType: Listener
  2. username: bob, password: bob, userType: Audiophile
  3. username: charlie, password: charlie, userType: Concert Manager
  4. username: admin, password: admin, userType: Admin

Exploring MusiCon

Note:

The MusiCon is based on retrieving data from Spotify API (https://developer.spotify.com/documentation/web-api/reference/), Last.FM API (https://www.last.fm/api) and TicketMaster API (https://developer.ticketmaster.com/products-and-docs/apis/discovery-api/v2/) and clicking on the Search fetches data from these APIs. If the data is not loading, it is certainly because of Error Code 429 and to fix this, just go back to the homepage by clicking on the MusiCon tab on the navigation bar and then try again. In case of any loading problems, please clear browser cache or open the localhost URL in incognito page. Once you register any new user, you will be navigated to Login Page to login for the first time. 3 APIs have been used in MusiCon (Spotify, Last.FM and TicketMaster), hence the entire application supports Admin, Anonymous, Listener, Audiophile and Concert Manager (Total 5 types of users).

Anonymous

  • When the application first loads, the anonymous user can see a navigation bar with Login and Registeration options and a Search Bar which he/she can use to search for Albums, Tracks, Artists and Events.
  • When the anonymous user searches for any album, they can click on Show on Spotify button to view the particular album on Spotify or can click on Get Details to view additional details of the album.
  • When the anonymous user searches for any track, they can click on Show on Spotify button to view the particular track on Spotify or can click on Get Details to view additional details of the track or can play a 30 second preview of any track (if available).
  • When the anonymous user searches for any artist, they can view which genre categories the artist belong to or they can click on Show on Spotify button to view the particular artist on Spotify or can click on Get Details to view additional details of the artist.
  • When the anonymous user searches for any event (by typing artist name or location name), they can click on Show on TicketMaster button to view the particular track on TicketMaster or can click on Show Seatmap to view additional details about the seating arrangement of concert. They also view the date, time and price of ticket for the concert.
  • The role of the API is just to fetch data based on queries by user.
  • If the anonymous user wants to recommend track/album, follow any audiophile or like any track/album or follow an artist or add artist to their created event, they can navigate to the Login tab in the navigation bar and login as either Listener/Audiophile/Concert Manager.

Listener

  • Click on Login tab and login as listener by entering username and password. After logging in as the Listener, you will get navigated to your Home Page, with 5 cards having different functionalities. Initially, you might not see any data when you click on any card as there is no data associated with the listener in the database. In order to view the data, you will need to populate the user data by interacting with the application (e.g like track/album).

[USER SEARCHES FOR A LIST OF DOMAIN OBJECTS THAT MATCH A CRITERIA]

  • Clicking on the MusiCon icon in the navbar takes you to the Search page where you can search for albums, tracks, artists and events.

[USER RELATED TO A DOMAIN OBJECT]

  • When you search for any album or track, you can like any of the results. Moreoever, when you search for any artist, you can follow them.
  • Listener can also create their own playlist by clicking on Playlist tab in navigation bar. To add any track to playlist, they have to Search for the track and click on 'Add to Playlist' button which will show all the playlists they have created. They can then choose whichever playlist they want to add track to.
  • Listener can view all the playlist they have created and click on Show Tracks to view list of tracks in playlist or can edit the name and description of playlist or can even delete any playlist.

[USER RELATED TO ANOTHER USER]

  • Third, click on Explore tab to see the list of all the registered audiophiles in the database. Initially, you will see Bob as an audiophile. You can follow Bob and any other audiophile shown in the list. You can also click on buttons given to view any recommended albums or tracks by the audiophile.
  • Lastly, you can go to your Home Page and click on any of the cards to see the above results reflected.

[A USER VIEWS DETAILS OF A PARTICULAR DOMAIN OBJECT LISTED IN THE SEARCH RESULT]

  • Listener can click on the Get More Details button on album/track/artist card while interacting with the Search Bar.
  • Similarly, listener can also click on Show on Spotify for any albums, tracks and artists or Show on TicketMaster for any event searched by them.

[USER VIEWS ALL DOMAIN OBJECTS RELATED TO USER]

  • In the home page of listener, the user can view any liked tracks/album, followed artists/audiophile and nearby concerts and can revert any action which they had performed with these domain objects.

[A USER VIEWS ALL OTHER USERS RELATED TO THE USER]

  • Listener can also see all the Audiophiles they are following in their Home Page.
  • Click on Logout tab to continue as another user.

Audiophile

  • Click on Login tab and login as audiophile by entering username and password. After Logging in as Audiophile, you will be navigated to your Home Page which will show you 2 cards having different functionalities such as Recommended Albums and Recommended Tracks.

[USER RELATED TO A DOMAIN OBJECT]

  • You can search for any album and track from the Search page and you get the option to recommend any track or album if you like it. These recommended tracks and albums can be seen by the listeners who are following you.

[USER SEARCHES FOR A LIST OF DOMAIN OBJECTS THAT MATCH A CRITERIA]

  • The audiophile can also search and view details of any album, track, artist or event.

[USER VIEWS ALL DOMAIN OBJECTS RELATED TO USER]

  • You can then navigate to the Audiophile's Page to view all your recommended tracks or albums.
  • Click on Logout tab to continue as another user.

Concert Manager

  • Click on Login tab and login as Concert Manager by entering username and password. After logging in as Concert Manager, you will be navigated to your Manager's Page which will show you a card in which click on the 'Show' button to navigate to the concert management page to create new events and view all your existing events.

[USER RELATED TO A DOMAIN OBJECT]

  • Concert Manager can search for artists from the Search page and can click on Add to Event which will show you all their events and give them option to add this artist to any listed event.

[USER SEARCHES FOR A LIST OF DOMAIN OBJECTS THAT MATCH A CRITERIA]

  • Concert Manager can also search for albums, tracks, artists and events but can only interact with artists (Add them to event).

[USER VIEWS ALL DOMAIN OBJECTS RELATED TO USER]

  • Concert Manager can view all the artists they have added in a particular event in the Manage Concerts page, by clicking on the Artists in Event on any event's card. They can also change name, location and date of event as well as remove any artist from the event. Moreover, clicking on the delete button deletes the event.
  • Click on Logout tab to continue as another user.

Admin

  • Now login as Admin user by entering admin username and password already in the database. Once logged in, you will be navigated to the Admin Page. On this page, you can view all the users of all types in a tabular format.

[AN ADMIN LISTS ALL USERS] & [ADMIN CREATES A USER] & [ADMIN EDITS A PARTICULAR USER] & [ADMIN REMOVES A USER]

  • You can edit any user details as well as delete the user from the database. Also, you can create a new user with any details.
  • To edit any user, click on corresponding user's edit button. This will show you editable input fields for each attribute of that user with existing values from database. After editing any attribute, you can click on update button to update the user.
  • To delete a user, click on corresponding user's delete button.
  • To create a new user, scroll down to view input fields row, where you can enter the details of a new user and click on create button to create the user in the database. The results are reflected in the table.
  • Additional functionalities for the Admin are that, they can view the list of all liked albums by all listeners, all recommended albums by all audiophiles, all liked tracks by all listeners and all tracks recommended by all audiophiles and can Delete in the same fashion as they can with the Users.
  • Admin can also manipulate the relationships between User-Domain Object as mentioned above. For example, when an admin deletes an entry for a user in the All Liked Albums table, it will delete relationship of that album with that user.

Cardinalities

Many-to-Many Relationship

  1. Listener to Artist
  2. Listener to Album
  3. Listener to Track
  4. Listener to Audiophile
  5. Audiophile to Track
  6. Audiophile to Album
  7. Event to Artist
  8. Playlist to Track

One-to-Many Relationship

  1. Concert Manager to Event
  2. Listener to Playlist
Clone this wiki locally