diff --git a/.glitch-assets b/.glitch-assets new file mode 100644 index 00000000..a04f55c7 --- /dev/null +++ b/.glitch-assets @@ -0,0 +1,13 @@ +{"name":"onlymp3.to - Congratulations, You Won!-tS_2hEmGnzA-192k-1660206668176.mp3","date":"2022-09-07T17:56:30.013Z","url":"https://cdn.glitch.global/3a54f5cf-842d-4a56-b067-db61308f1f3c/onlymp3.to%20-%20Congratulations%2C%20You%20Won!-tS_2hEmGnzA-192k-1660206668176.mp3","type":"audio/mpeg","size":81837,"thumbnail":"https://cdn.glitch.global/3a54f5cf-842d-4a56-b067-db61308f1f3c/thumbnails%2Fonlymp3.to%20-%20Congratulations%2C%20You%20Won!-tS_2hEmGnzA-192k-1660206668176.mp3","thumbnailWidth":210,"thumbnailHeight":210,"uuid":"AKd6R5zmBSa7eIOe"} +{"uuid":"AKd6R5zmBSa7eIOe","deleted":true} +{"name":"onlymp3.to - Congratulations, You Won!-tS_2hEmGnzA-192k-1660206668176.mp3","date":"2022-09-07T17:56:35.757Z","url":"https://cdn.glitch.global/3a54f5cf-842d-4a56-b067-db61308f1f3c/onlymp3.to%20-%20Congratulations%2C%20You%20Won!-tS_2hEmGnzA-192k-1660206668176.mp3","type":"audio/mpeg","size":81837,"thumbnail":"https://cdn.glitch.global/3a54f5cf-842d-4a56-b067-db61308f1f3c/thumbnails%2Fonlymp3.to%20-%20Congratulations%2C%20You%20Won!-tS_2hEmGnzA-192k-1660206668176.mp3","thumbnailWidth":210,"thumbnailHeight":210,"uuid":"W9mkXgSeDAa5aHAE"} +{"name":"congratulations.mp3","date":"2022-09-07T17:57:13.688Z","url":"https://cdn.glitch.global/3a54f5cf-842d-4a56-b067-db61308f1f3c/congratulations.mp3","type":"audio/mpeg","size":81837,"thumbnail":"https://cdn.glitch.global/3a54f5cf-842d-4a56-b067-db61308f1f3c/thumbnails%2Fcongratulations.mp3","thumbnailWidth":210,"thumbnailHeight":210,"uuid":"cTCOMEO1d1fMA6cY"} +{"uuid":"W9mkXgSeDAa5aHAE","deleted":true} +{"uuid":"cTCOMEO1d1fMA6cY","deleted":true} +{"name":"congratulations.mp3","date":"2022-09-07T19:01:36.679Z","url":"https://cdn.glitch.global/3a54f5cf-842d-4a56-b067-db61308f1f3c/congratulations.mp3","type":"audio/mpeg","size":81837,"thumbnail":"https://cdn.glitch.global/3a54f5cf-842d-4a56-b067-db61308f1f3c/thumbnails%2Fcongratulations.mp3","thumbnailWidth":210,"thumbnailHeight":210,"uuid":"y0bZmaKXoThYk5jm"} +{"name":"Mario.mp3","date":"2022-10-04T07:12:17.998Z","url":"https://cdn.glitch.global/1ac0c3bf-5e02-4570-a87d-e58b8c6feba1/Mario.mp3","type":"audio/mpeg","size":43401,"thumbnail":"https://cdn.glitch.global/1ac0c3bf-5e02-4570-a87d-e58b8c6feba1/thumbnails%2FMario.mp3","thumbnailWidth":210,"thumbnailHeight":210,"uuid":"xUhaWZfxRZ81l2Mc"} +{"name":"mario.jpg","date":"2022-10-04T07:25:48.810Z","url":"https://cdn.glitch.global/1ac0c3bf-5e02-4570-a87d-e58b8c6feba1/mario.jpg","type":"image/jpeg","size":81856,"imageWidth":1600,"imageHeight":900,"thumbnail":"https://cdn.glitch.global/1ac0c3bf-5e02-4570-a87d-e58b8c6feba1/thumbnails%2Fmario.jpg","thumbnailWidth":330,"thumbnailHeight":186,"uuid":"5gscS4pVXbOm8ivQ"} +{"name":"9aa6ad9f-b8bb-43c3-a8cd-0b3897ee9556.image.png","date":"2022-10-04T07:42:09.105Z","url":"https://cdn.glitch.global/1ac0c3bf-5e02-4570-a87d-e58b8c6feba1/9aa6ad9f-b8bb-43c3-a8cd-0b3897ee9556.image.png","type":"image/png","size":311593,"imageWidth":937,"imageHeight":952,"thumbnail":"https://cdn.glitch.global/1ac0c3bf-5e02-4570-a87d-e58b8c6feba1/thumbnails%2F9aa6ad9f-b8bb-43c3-a8cd-0b3897ee9556.image.png","thumbnailWidth":325,"thumbnailHeight":330,"uuid":"51I8I2VQjgWKxvUO"} +{"name":"bc27b15d-b919-4be4-8b81-b0ad0219e1ea.image.png","date":"2022-10-04T07:42:16.698Z","url":"https://cdn.glitch.global/1ac0c3bf-5e02-4570-a87d-e58b8c6feba1/bc27b15d-b919-4be4-8b81-b0ad0219e1ea.image.png","type":"image/png","size":311593,"imageWidth":937,"imageHeight":952,"thumbnail":"https://cdn.glitch.global/1ac0c3bf-5e02-4570-a87d-e58b8c6feba1/thumbnails%2Fbc27b15d-b919-4be4-8b81-b0ad0219e1ea.image.png","thumbnailWidth":325,"thumbnailHeight":330,"uuid":"zMtg6ST7lXfHhVXa"} +{"uuid":"zMtg6ST7lXfHhVXa","deleted":true} +{"uuid":"51I8I2VQjgWKxvUO","deleted":true} diff --git a/README.md b/README.md index 3ae10a92..255917ac 100644 --- a/README.md +++ b/README.md @@ -1,61 +1,21 @@ -Assignment 4 - Creative Coding: Interactive Multimedia Experiences -=== +## Super Mario Music Maker! -Due: October 4th, by 11:59 AM. +https://glitch.com/edit/#!/a4-creative-coding -For this assignment we will focus on client-side development using popular audio/graphics/visualization technologies. The goal of this assignment is to refine our JavaScript knowledge while exploring the multimedia capabilities of the browser. +This project, for the a4 creative coding assignment, uses the Web Audio API to manipulate audio files, such as +Mario saying "It's a-me! Mario!" in accordance with how the user wants. The user can use sliders to bring the +volume up or bring the volume down. They can also use a slider to weight the audio towards the left speaker or weight +the audio towards the right speaker (assuming they have stereo-capable hardware). They can also enter their username +along with the name of their favorite song, both of which will be stored on an express server and displayed. -[WebAudio / Canvas / Three Tutorial](https://github.com/cs4241-21a/cs4241-21a.github.io/blob/main/webaudio_canvas_three.md) -[SVG + D3 tutorial](https://github.com/cs4241-21a/cs4241-21a.github.io/blob/main/using_svg_and_d3.md) +My biggest challenge in this project was fighting Google and the SEC. This is because google won't let you +play audio files by default on sites through the HTML (https://developer.chrome.com/blog/autoplay/#webaudio), +which made testing this virtually impossible. I sure hope you find the sound to be working on your machine, +because as far as I can tell stepping through my code I have all the infrastructure in place for a working +project from the script down to the assets but have no way of confirming it's cool. And no, I refuse to reinstall +Edge after what Microsoft did to me. -Baseline Requirements ---- +With that in mind, I hope you enjoy the beautiful ASMR of your own design at your disposal, assuming you would've +designed the ASMR to consist entirely of Mario sayiny "It's a-me! Mario!" at various volumes and audio-pan positions. -Your application is required to implement the following functionalities: - -- A server created using Express. This server can be as simple as needed. -- A client-side interactive experience using at least one of the following web technologies frameworks. - - [Three.js](https://threejs.org/): A library for 3D graphics / VR experiences - - [D3.js](https://d3js.org): A library that is primarily used for interactive data visualizations - - [Canvas](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API): A 2D raster drawing API included in all modern browsers - - [SVG](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API): A 2D vector drawing framework that enables shapes to be defined via XML. - - [Web Audio API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API): An API for audio synthesis, analysis, processing, and file playback. -- A user interface for interaction with your project, which must expose at least four parameters for user control. [tweakpane](https://cocopon.github.io/tweakpane/) is highly recommended for this, but you can also use regular HTML `` tags (the `range` type is useful to create sliders). You might also explore interaction by tracking mouse movement via the `window.onmousemove` event handler in tandem with the `event.clientX` and `event.clientY` properties. Consider using the [Pointer Events API](https://developer.mozilla.org/en-US/docs/Web/API/Pointer_events) to ensure that that both mouse and touch events will both be supported in your app. -- Your application should display basic documentation for the user interface when the application first loads. - -The interactive experience should possess a reasonable level of complexity. Some examples: -### Three.js -- A generative algorithm creates simple agents that move through a virtual world. Your interface controls the behavior / appearance of these agents. -- A simple 3D game... you really want this to be a simple as possible or it will be outside the scope of this assignment. -- An 3D audio visualization of a song of your choosing. User interaction should control aspects of the visualization. -### Canvas -- Implement a generative algorithm such as [Conway's Game of Life](https://bitstorm.org/gameoflife/) (or 1D cellular automata) and provide interactive controls. Note that the Game of Life has been created by 100s of people using ; we'll be checking to ensure that your implementation is not a copy of these. -- Design a 2D audio visualizer of a song of your choosing. User interaction should control visual aspects of the experience. -### Web Audio API -- Create a screen-based musical instrument using the Web Audio API. You can use projects such as [Interface.js](http://charlie-roberts.com/interface/) or [Nexus UI](https://nexus-js.github.io/ui/api/#Piano) to provide common musical interface elements, or use dat.GUI in combination with mouse/touch events (use the Pointer Events API). Your GUI should enable users to control aspects of sound synthesis. If you want to use higher-level instruments instead of the raw WebAudio API sounds, consider trying the instruments provided by [Tone.js]() or [Gibber](https://github.com/charlieroberts/gibber.audio.lib). -### D3.js -- Create visualizations using the datasets found at [Awesome JSON Datasets](https://github.com/jdorfman/Awesome-JSON-Datasets). Experiment with providing different visualizations of the same data set, and providing users interactive control over visualization parameters and/or data filtering. Alternatively, create a single visualization with using one of the more complicated techniques shown at [d3js.org](d3js.org) and provide meaningful points of interaction for users. - -Deliverables ---- - -Do the following to complete this assignment: - -1. Implement your project with the above requirements. -3. Test your project to make sure that when someone goes to your main page on Glitch/Heroku/etc., it displays correctly. -4. Ensure that your project has the proper naming scheme `a4-firstname-lastname` so we can find it. -5. Fork this repository and modify the README to the specifications below. *NOTE: If you don't use Glitch for hosting (where we can see the files) then you must include all project files that you author in your repo for this assignment*. -6. Create and submit a Pull Request to the original repo. Name the pull request using the following template: `a4-firstname-lastname`. - -Sample Readme (delete the above when you're ready to submit, and modify the below so with your links and descriptions) ---- - -## Your Web Application Title - -your hosting link e.g. http://a4-charlieroberts.glitch.me - -Include a very brief summary of your project here. Images are encouraged when needed, along with concise, high-level text. Be sure to include: - -- the goal of the application -- challenges you faced in realizing the application -- the instructions you present in the website should be clear enough to use the application, but if you feel any need to provide additional instructions please do so here. +Also, I did a fork for the a4-components as well, which I will not attempt to submit. This is my a4. \ No newline at end of file diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 00000000..e59f2e90 --- /dev/null +++ b/package-lock.json @@ -0,0 +1,271 @@ +{ + "requires": true, + "lockfileVersion": 1, + "dependencies": { + "mime": { + "version": "2.6.0" + }, + "web-audio-api": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/web-audio-api/-/web-audio-api-0.2.2.tgz", + "integrity": "sha512-XidLn3tEz8V9jwuV4OOVTOgNHp3WT6SQwv28Ad3lNXU4R9aPxWDYnocfVBh/OIna96jYPpiuP74KvSrTIF0OTg==", + "requires": { + "aac": "0.1.x", + "alac": "0.1.x", + "async": "0.9.x", + "audiobuffer": "0.2.x", + "av": "0.4.x", + "flac": "0.3.x", + "mp3": "0.1.x", + "pcm-boilerplate": "0.1.x", + "underscore": "1.8.x" + }, + "dependencies": { + "aac": { + "version": "0.1.3", + "resolved": "https://registry.npmjs.org/aac/-/aac-0.1.3.tgz", + "integrity": "sha512-mhkqrzCOMndmoQovW43ry8tkMttuvKcpU0u9/K7zI+lF5NtCY2NE+HwAPiEgd3rHK7IuBT1ZsGL+LKeCPW9btQ==" + }, + "abc": { + "version": "0.5.1", + "resolved": "https://registry.npmjs.org/abc/-/abc-0.5.1.tgz", + "integrity": "sha512-WRBP9wjuEdmzw1yFHCVf7Qp/PXSmfuUSX3FSs+5+uLG4qGKmhOPKl8LtZaG0p6xxuB6hX1tIzH4VaHL23+bU5A==" + }, + "alac": { + "version": "0.1.0", + "resolved": "https://registry.npmjs.org/alac/-/alac-0.1.0.tgz", + "integrity": "sha512-+NBR/Nj/5zndHO7Oz4EOE7Qj+v+hk/0edJerBhjMQRznyjfaYV6/W+tUOOlLTZ0BWWD4p6eb11KKDHoPW5LsCw==" + }, + "assertion-error": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.0.0.tgz", + "integrity": "sha512-g/gZV+G476cnmtYI+Ko9d5khxSoCSoom/EaNmmCfwpOvBXEJ18qwFrxfP1/CsIqk2no1sAKKwxndV0tP7ROOFQ==" + }, + "async": { + "version": "0.9.2", + "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz", + "integrity": "sha512-l6ToIJIotphWahxxHyzK9bnLR6kM4jJIIgLShZeqLY7iboHoGkdgFl7W2/Ivi4SkMJYGKqW8vSuk0uKUj6qsSw==" + }, + "audiobuffer": { + "version": "0.2.0", + "resolved": "https://registry.npmjs.org/audiobuffer/-/audiobuffer-0.2.0.tgz", + "integrity": "sha512-wEZ3iAOK1yNCy1PNcSe2V1pzzCV5rezYg0r/TRwojZBIVupQF56ioI0x5PGgatmWxJ4t8sWXymg8AFfopPXfrg==", + "requires": { + "underscore": "1.4.x" + }, + "dependencies": { + "underscore": { + "version": "1.4.4", + "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.4.4.tgz", + "integrity": "sha512-ZqGrAgaqqZM7LGRzNjLnw5elevWb5M8LEoDMadxIW3OWbcv72wMMgKdwOKpd5Fqxe8choLD8HN3iSj3TUh/giQ==" + } + } + }, + "av": { + "version": "0.4.9", + "resolved": "https://registry.npmjs.org/av/-/av-0.4.9.tgz", + "integrity": "sha512-MvkT0k+co6o+zLMrBFFeVhYcG/S/jzy+2p00c/VwA71q6g90J28qUNh93NabKrcN06bkwFK0OeiEpFsQd7TS7g==", + "requires": { + "coffeeify": "^0.6.0", + "speaker": "^0.3.0" + } + }, + "bindings": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz", + "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==", + "optional": true, + "requires": { + "file-uri-to-path": "1.0.0" + } + }, + "chai": { + "version": "1.7.2", + "resolved": "https://registry.npmjs.org/chai/-/chai-1.7.2.tgz", + "integrity": "sha512-iTItmoMR+S+g8g0xU7db2mrr2LeLMJ6Y+YJwJEOUSaVTzm6qyTBfj5r+5x+XQhlXUfVn6WfFS4sXpEtMg6Qwaw==", + "requires": { + "assertion-error": "1.0.0" + } + }, + "coffee-script": { + "version": "1.7.1", + "resolved": "https://registry.npmjs.org/coffee-script/-/coffee-script-1.7.1.tgz", + "integrity": "sha512-W3s+SROY73OmrSGtPTTW/2wp2rmW5vuh0/tUuCK1NvTuyzLOVPccIP9whmhZ4cYWcr2NJPNENZIFaAMkTD5G3w==", + "requires": { + "mkdirp": "~0.3.5" + } + }, + "coffeeify": { + "version": "0.6.0", + "resolved": "https://registry.npmjs.org/coffeeify/-/coffeeify-0.6.0.tgz", + "integrity": "sha512-nt2rZwyeqLnzdbC15ZUBnQtokHLqNnbgfpUMYzAk1Pa33hObdtXnDV0SmTj2DWbzp47MpR87ix3uKHyutnzjsg==", + "requires": { + "coffee-script": "~1.7.0", + "convert-source-map": "~0.3.3", + "through": "~2.3.4" + } + }, + "convert-source-map": { + "version": "0.3.5", + "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-0.3.5.tgz", + "integrity": "sha512-+4nRk0k3oEpwUB7/CalD7xE2z4VmtEnnq0GO2IPTkrooTrAhEsWvuLF5iWP1dXrwluki/azwXV1ve7gtYuPldg==" + }, + "core-util-is": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.3.tgz", + "integrity": "sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==", + "optional": true + }, + "debug": { + "version": "2.6.9", + "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz", + "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==", + "optional": true, + "requires": { + "ms": "2.0.0" + } + }, + "file-uri-to-path": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz", + "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==", + "optional": true + }, + "flac": { + "version": "0.3.0", + "resolved": "https://registry.npmjs.org/flac/-/flac-0.3.0.tgz", + "integrity": "sha512-52oFJru3F/aELcnDwHtqDNXxruIZH7bE3vK6xQF4ALCelCZBXFggqPsPXPilVs9L242Iz1ROrbVX0UYXJMMinw==", + "requires": { + "abc": "0.5.x", + "fsa": "0.5.x" + } + }, + "fsa": { + "version": "0.5.1", + "resolved": "https://registry.npmjs.org/fsa/-/fsa-0.5.1.tgz", + "integrity": "sha512-HMdf0zJNXwP5dxROQb/ncUv+9BxuO4NM5R6/pSbUdfu5CUzMOg7+iP4tQUtBIv18PaScukzfxGIqLyJ3d9wg3Q==" + }, + "inherits": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz", + "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==", + "optional": true + }, + "isarray": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz", + "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==", + "optional": true + }, + "mkdirp": { + "version": "0.3.5", + "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.3.5.tgz", + "integrity": "sha512-8OCq0De/h9ZxseqzCH8Kw/Filf5pF/vMI6+BH7Lu0jXz2pqYCjTAQRolSxRIi+Ax+oCCjlxoJMP0YQ4XlrQNHg==" + }, + "mp3": { + "version": "0.1.0", + "resolved": "https://registry.npmjs.org/mp3/-/mp3-0.1.0.tgz", + "integrity": "sha512-W9SQWAS8Gn7VvBHBSYnCIz2KAEzZccY+OAKJvO9JRRFBc0MfQ0icb7K4O9Sst/3SW1wcScC+zLNPYoiU6sSXww==" + }, + "ms": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", + "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==", + "optional": true + }, + "nan": { + "version": "2.16.0", + "resolved": "https://registry.npmjs.org/nan/-/nan-2.16.0.tgz", + "integrity": "sha512-UdAqHyFngu7TfQKsCBgAA6pWDkT8MAO7d0jyOecVhN5354xbLqdn8mV9Tat9gepAupm0bt2DbeaSC8vS52MuFA==", + "optional": true + }, + "pcm-boilerplate": { + "version": "0.1.1", + "resolved": "https://registry.npmjs.org/pcm-boilerplate/-/pcm-boilerplate-0.1.1.tgz", + "integrity": "sha512-2mU5wENQGQoiuYUiRbLJtI8cH7H+1yvjR400XfGH6JONyzERbSbAIFCJnfRUSfbGJi2WJdo1gbTjiTsDyFSY4Q==", + "requires": { + "async": "0.2.x", + "chai": "1.7.x", + "underscore": "1.4.x" + }, + "dependencies": { + "async": { + "version": "0.2.10", + "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz", + "integrity": "sha512-eAkdoKxU6/LkKDBzLpT+t6Ff5EtfSF4wx1WfJiPEEV7WNLnDaRXk0oVysiEPm262roaachGexwUv94WhSgN5TQ==" + }, + "underscore": { + "version": "1.4.4", + "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.4.4.tgz", + "integrity": "sha512-ZqGrAgaqqZM7LGRzNjLnw5elevWb5M8LEoDMadxIW3OWbcv72wMMgKdwOKpd5Fqxe8choLD8HN3iSj3TUh/giQ==" + } + } + }, + "process-nextick-args": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz", + "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==", + "optional": true + }, + "readable-stream": { + "version": "2.3.7", + "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz", + "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==", + "optional": true, + "requires": { + "core-util-is": "~1.0.0", + "inherits": "~2.0.3", + "isarray": "~1.0.0", + "process-nextick-args": "~2.0.0", + "safe-buffer": "~5.1.1", + "string_decoder": "~1.1.1", + "util-deprecate": "~1.0.1" + } + }, + "safe-buffer": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz", + "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==", + "optional": true + }, + "speaker": { + "version": "0.3.1", + "resolved": "https://registry.npmjs.org/speaker/-/speaker-0.3.1.tgz", + "integrity": "sha512-LEqSy+FHYHPZj4kX8NHylzaOmy+VIqj57enm2GS4B568hj0SdKDYa9jALCGQy43LZa/JmQk1iF0nlMVbS1PfPg==", + "optional": true, + "requires": { + "bindings": "^1.2.1", + "debug": "^2.2.0", + "nan": "^2.2.0", + "readable-stream": "^2.0.5" + } + }, + "string_decoder": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz", + "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==", + "optional": true, + "requires": { + "safe-buffer": "~5.1.0" + } + }, + "through": { + "version": "2.3.8", + "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz", + "integrity": "sha512-w89qg7PI8wAdvX60bMDP+bFoD5Dvhm9oLheFp5O4a2QF0cSBGsBX4qZmadPMvVqlLJBBci+WqGGOAPvcDeNSVg==" + }, + "underscore": { + "version": "1.8.3", + "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.8.3.tgz", + "integrity": "sha512-5WsVTFcH1ut/kkhAaHf4PVgI8c7++GiVcpCGxPouI6ZVjsqPnSDf8h/8HtVqc0t4fzRXwnMK70EcZeAs3PIddg==" + }, + "util-deprecate": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz", + "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==", + "optional": true + } + } + } + } +} diff --git a/package.json b/package.json new file mode 100644 index 00000000..6db862d2 --- /dev/null +++ b/package.json @@ -0,0 +1,13 @@ +{ + "name": "", + "version": "", + "description": "", + "author": "", + "scripts": { + "start": "node server.improved.js" + }, + "dependencies": { + "mime": "^2.4.4", + "web-audio-api": "^0.2.2" + } +} diff --git a/public/airsoft.jpg b/public/airsoft.jpg new file mode 100644 index 00000000..9a8e1483 Binary files /dev/null and b/public/airsoft.jpg differ diff --git a/public/bear.PNG b/public/bear.PNG new file mode 100644 index 00000000..24e1d396 Binary files /dev/null and b/public/bear.PNG differ diff --git a/public/css/style.css b/public/css/style.css new file mode 100644 index 00000000..6f9667c8 --- /dev/null +++ b/public/css/style.css @@ -0,0 +1,14 @@ +body { + font-family: 'Comic Neue', cursive; + text-align: center; +} + +table { + text-align: center; + border-radius: 16px; + background-color: #B601A7; + padding: 1.5em; + color: black; + position: relative; + left: 200px +} \ No newline at end of file diff --git a/public/download.png b/public/download.png new file mode 100644 index 00000000..34fc9ed7 Binary files /dev/null and b/public/download.png differ diff --git a/public/index.html b/public/index.html new file mode 100644 index 00000000..ed8057e6 --- /dev/null +++ b/public/index.html @@ -0,0 +1,187 @@ + + + + CS4241 Assignment 2 + + + + + +

Super Mario Music Maker!

+

*Not affiliated with Nintendo inc.

+ +
+ + + +
+

don't Click the Button below its virus.:

+ +

Here's other people's favorite songs:

+
+ + + +

+ Play the Mario sound! +

+ + +

+ Change the volume up or change the volume down! +

+ +

+ Make the audio left or make the audio right! +

+ + + + + + diff --git a/public/js/scripts.js b/public/js/scripts.js new file mode 100644 index 00000000..cca055a8 --- /dev/null +++ b/public/js/scripts.js @@ -0,0 +1,14 @@ +// Add some Javascript code here, to run on the front end. + +console.log("Welcome to assignment 2!") + +let andrewGarfield = setInterval(updateColor, 15); + let colorCounter = 0; + + function updateColor() { + colorCounter += 1; + if (colorCounter > 255) { + colorCounter = 1; + } + theBody.style.backgroundColor = "rgb("+colorCounter % 60+","+colorCounter % 60+","+(colorCounter+colorCounter) % 60+")"; + } \ No newline at end of file diff --git a/server.improved.js b/server.improved.js new file mode 100644 index 00000000..cfd9b6d5 --- /dev/null +++ b/server.improved.js @@ -0,0 +1,83 @@ +const http = require( 'http' ), + fs = require( 'fs' ), + // IMPORTANT: you must run `npm install` in the directory for this assignment + // to install the mime library used in the following line of code + mime = require( 'mime' ), + dir = 'public/', + port = 3000 + +const appdata = [ + +] + +const server = http.createServer( function( request,response ) { + if( request.method === 'GET' ) { + handleGet( request, response ) + }else if( request.method === 'POST' ){ + handlePost( request, response ) + } +}) + +const handleGet = function( request, response ) { + const filename = dir + request.url.slice( 1 ) + + if( request.url === '/' ) { + sendFile( response, 'public/index.html' ) + }else{ + sendFile( response, filename ) + } +} + +const handlePost = function( request, response ) { + let dataString = '' + + request.on( 'data', function( data ) { + dataString += data + }) + + request.on( 'end', function() { + console.log( JSON.parse( dataString ) ) + let dataInstance = JSON.parse( dataString ) + let hotbed = false; + + for (let i = 0; i < appdata.length; i++) { + if (appdata[i].wheresoft == dataInstance.wheresoft) { + hotbed = true; + } + } + if (hotbed) { + dataInstance.hotbed = "That seems like a hotbed for activity!"; + } + + appdata.push(dataInstance) + + response.writeHead( 200, "OK", {'Content-Type': 'text/plain' }) + response.write( JSON.stringify( appdata ) ) + console.log(appdata) + response.end() + }) +} + +const sendFile = function( response, filename ) { + const type = mime.getType( filename ) + + fs.readFile( filename, function( err, content ) { + + // if the error = null, then we've loaded the file successfully + if( err === null ) { + + // status code: https://httpstatuses.com + response.writeHeader( 200, { 'Content-Type': type }) + response.end( content ) + + }else{ + + // file not found, error code 404 + response.writeHeader( 404 ) + response.end( '404 Error: File Not Found' ) + + } + }) +} + +server.listen( process.env.PORT || port ) diff --git a/shrinkwrap.yaml b/shrinkwrap.yaml new file mode 100644 index 00000000..27648128 --- /dev/null +++ b/shrinkwrap.yaml @@ -0,0 +1,256 @@ +dependencies: + mime: 2.6.0 + web-audio-api: 0.2.2 +packages: + /aac/0.1.3/av@0.4.9: + dependencies: + av: 0.4.9 + dev: false + id: registry.npmjs.org/aac/0.1.3 + peerDependencies: + av: ~0.4.0 + resolution: + integrity: sha512-mhkqrzCOMndmoQovW43ry8tkMttuvKcpU0u9/K7zI+lF5NtCY2NE+HwAPiEgd3rHK7IuBT1ZsGL+LKeCPW9btQ== + /abc/0.5.1: + dev: false + engines: + node: '>=0.4.0' + resolution: + integrity: sha512-WRBP9wjuEdmzw1yFHCVf7Qp/PXSmfuUSX3FSs+5+uLG4qGKmhOPKl8LtZaG0p6xxuB6hX1tIzH4VaHL23+bU5A== + /alac/0.1.0/av@0.4.9: + dependencies: + av: 0.4.9 + dev: false + id: registry.npmjs.org/alac/0.1.0 + peerDependencies: + av: ~0.4.0 + resolution: + integrity: sha512-+NBR/Nj/5zndHO7Oz4EOE7Qj+v+hk/0edJerBhjMQRznyjfaYV6/W+tUOOlLTZ0BWWD4p6eb11KKDHoPW5LsCw== + /assertion-error/1.0.0: + dev: false + resolution: + integrity: sha512-g/gZV+G476cnmtYI+Ko9d5khxSoCSoom/EaNmmCfwpOvBXEJ18qwFrxfP1/CsIqk2no1sAKKwxndV0tP7ROOFQ== + /async/0.2.10: + dev: false + resolution: + integrity: sha512-eAkdoKxU6/LkKDBzLpT+t6Ff5EtfSF4wx1WfJiPEEV7WNLnDaRXk0oVysiEPm262roaachGexwUv94WhSgN5TQ== + /async/0.9.2: + dev: false + resolution: + integrity: sha512-l6ToIJIotphWahxxHyzK9bnLR6kM4jJIIgLShZeqLY7iboHoGkdgFl7W2/Ivi4SkMJYGKqW8vSuk0uKUj6qsSw== + /audiobuffer/0.2.0: + dependencies: + underscore: 1.4.4 + dev: false + engines: + node: '>=0.10' + resolution: + integrity: sha512-wEZ3iAOK1yNCy1PNcSe2V1pzzCV5rezYg0r/TRwojZBIVupQF56ioI0x5PGgatmWxJ4t8sWXymg8AFfopPXfrg== + /av/0.4.9: + dependencies: + coffeeify: 0.6.0 + dev: false + optionalDependencies: + speaker: 0.3.1 + resolution: + integrity: sha512-MvkT0k+co6o+zLMrBFFeVhYcG/S/jzy+2p00c/VwA71q6g90J28qUNh93NabKrcN06bkwFK0OeiEpFsQd7TS7g== + /bindings/1.5.0: + dependencies: + file-uri-to-path: 1.0.0 + dev: false + optional: true + resolution: + integrity: sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ== + /chai/1.7.2: + dependencies: + assertion-error: 1.0.0 + dev: false + engines: + node: '>= 0.4.0' + resolution: + integrity: sha512-iTItmoMR+S+g8g0xU7db2mrr2LeLMJ6Y+YJwJEOUSaVTzm6qyTBfj5r+5x+XQhlXUfVn6WfFS4sXpEtMg6Qwaw== + /coffee-script/1.7.1: + dependencies: + mkdirp: 0.3.5 + deprecated: CoffeeScript on NPM has moved to "coffeescript" (no hyphen) + dev: false + engines: + node: '>=0.8.0' + hasBin: true + resolution: + integrity: sha512-W3s+SROY73OmrSGtPTTW/2wp2rmW5vuh0/tUuCK1NvTuyzLOVPccIP9whmhZ4cYWcr2NJPNENZIFaAMkTD5G3w== + /coffeeify/0.6.0: + dependencies: + coffee-script: 1.7.1 + convert-source-map: 0.3.5 + through: 2.3.8 + dev: false + resolution: + integrity: sha512-nt2rZwyeqLnzdbC15ZUBnQtokHLqNnbgfpUMYzAk1Pa33hObdtXnDV0SmTj2DWbzp47MpR87ix3uKHyutnzjsg== + /convert-source-map/0.3.5: + dev: false + resolution: + integrity: sha512-+4nRk0k3oEpwUB7/CalD7xE2z4VmtEnnq0GO2IPTkrooTrAhEsWvuLF5iWP1dXrwluki/azwXV1ve7gtYuPldg== + /core-util-is/1.0.3: + dev: false + optional: true + resolution: + integrity: sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ== + /debug/2.6.9: + dependencies: + ms: 2.0.0 + dev: false + optional: true + resolution: + integrity: sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA== + /file-uri-to-path/1.0.0: + dev: false + optional: true + resolution: + integrity: sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw== + /flac/0.3.0: + dependencies: + abc: 0.5.1 + fsa: 0.5.1 + dev: false + engines: + node: '>=0.4' + resolution: + integrity: sha512-52oFJru3F/aELcnDwHtqDNXxruIZH7bE3vK6xQF4ALCelCZBXFggqPsPXPilVs9L242Iz1ROrbVX0UYXJMMinw== + /fsa/0.5.1: + dev: false + engines: + node: '>=0.4' + resolution: + integrity: sha512-HMdf0zJNXwP5dxROQb/ncUv+9BxuO4NM5R6/pSbUdfu5CUzMOg7+iP4tQUtBIv18PaScukzfxGIqLyJ3d9wg3Q== + /inherits/2.0.4: + dev: false + optional: true + resolution: + integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ== + /isarray/1.0.0: + dev: false + optional: true + resolution: + integrity: sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ== + /mime/2.6.0: + dev: false + engines: + node: '>=4.0.0' + hasBin: true + resolution: + integrity: sha512-USPkMeET31rOMiarsBNIHZKLGgvKc/LrjofAnBlOttf5ajRvqiRA8QsenbcooctK6d6Ts6aqZXBA+XbkKthiQg== + /mkdirp/0.3.5: + deprecated: Legacy versions of mkdirp are no longer supported. Please update to mkdirp 1.x. (Note that the API surface has changed to use Promises in 1.x.) + dev: false + resolution: + integrity: sha512-8OCq0De/h9ZxseqzCH8Kw/Filf5pF/vMI6+BH7Lu0jXz2pqYCjTAQRolSxRIi+Ax+oCCjlxoJMP0YQ4XlrQNHg== + /mp3/0.1.0/av@0.4.9: + dependencies: + av: 0.4.9 + dev: false + id: registry.npmjs.org/mp3/0.1.0 + peerDependencies: + av: ~0.4.0 + resolution: + integrity: sha512-W9SQWAS8Gn7VvBHBSYnCIz2KAEzZccY+OAKJvO9JRRFBc0MfQ0icb7K4O9Sst/3SW1wcScC+zLNPYoiU6sSXww== + /ms/2.0.0: + dev: false + optional: true + resolution: + integrity: sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A== + /nan/2.16.0: + dev: false + optional: true + resolution: + integrity: sha512-UdAqHyFngu7TfQKsCBgAA6pWDkT8MAO7d0jyOecVhN5354xbLqdn8mV9Tat9gepAupm0bt2DbeaSC8vS52MuFA== + /pcm-boilerplate/0.1.1: + dependencies: + async: 0.2.10 + chai: 1.7.2 + underscore: 1.4.4 + dev: false + engines: + node: '>=0.10' + resolution: + integrity: sha512-2mU5wENQGQoiuYUiRbLJtI8cH7H+1yvjR400XfGH6JONyzERbSbAIFCJnfRUSfbGJi2WJdo1gbTjiTsDyFSY4Q== + /process-nextick-args/2.0.1: + dev: false + optional: true + resolution: + integrity: sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag== + /readable-stream/2.3.7: + dependencies: + core-util-is: 1.0.3 + inherits: 2.0.4 + isarray: 1.0.0 + process-nextick-args: 2.0.1 + safe-buffer: 5.1.2 + string_decoder: 1.1.1 + util-deprecate: 1.0.2 + dev: false + optional: true + resolution: + integrity: sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw== + /safe-buffer/5.1.2: + dev: false + optional: true + resolution: + integrity: sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g== + /speaker/0.3.1: + dependencies: + bindings: 1.5.0 + debug: 2.6.9 + nan: 2.16.0 + readable-stream: 2.3.7 + dev: false + optional: true + requiresBuild: true + resolution: + integrity: sha512-LEqSy+FHYHPZj4kX8NHylzaOmy+VIqj57enm2GS4B568hj0SdKDYa9jALCGQy43LZa/JmQk1iF0nlMVbS1PfPg== + /string_decoder/1.1.1: + dependencies: + safe-buffer: 5.1.2 + dev: false + optional: true + resolution: + integrity: sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg== + /through/2.3.8: + dev: false + resolution: + integrity: sha512-w89qg7PI8wAdvX60bMDP+bFoD5Dvhm9oLheFp5O4a2QF0cSBGsBX4qZmadPMvVqlLJBBci+WqGGOAPvcDeNSVg== + /underscore/1.4.4: + dev: false + resolution: + integrity: sha512-ZqGrAgaqqZM7LGRzNjLnw5elevWb5M8LEoDMadxIW3OWbcv72wMMgKdwOKpd5Fqxe8choLD8HN3iSj3TUh/giQ== + /underscore/1.8.3: + dev: false + resolution: + integrity: sha512-5WsVTFcH1ut/kkhAaHf4PVgI8c7++GiVcpCGxPouI6ZVjsqPnSDf8h/8HtVqc0t4fzRXwnMK70EcZeAs3PIddg== + /util-deprecate/1.0.2: + dev: false + optional: true + resolution: + integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw== + /web-audio-api/0.2.2: + dependencies: + aac: /aac/0.1.3/av@0.4.9 + alac: /alac/0.1.0/av@0.4.9 + async: 0.9.2 + audiobuffer: 0.2.0 + av: 0.4.9 + flac: 0.3.0 + mp3: /mp3/0.1.0/av@0.4.9 + pcm-boilerplate: 0.1.1 + underscore: 1.8.3 + dev: false + engines: + node: '>=0.10' + resolution: + integrity: sha512-XidLn3tEz8V9jwuV4OOVTOgNHp3WT6SQwv28Ad3lNXU4R9aPxWDYnocfVBh/OIna96jYPpiuP74KvSrTIF0OTg== +registry: 'https://registry.npmjs.org/' +shrinkwrapMinorVersion: 9 +shrinkwrapVersion: 3 +specifiers: + mime: ^2.4.4 + web-audio-api: ^0.2.2