
Create a js file called cart.js and make a product object for each of the products and store them in a products array when the script loads. Create an empty array to store the items added to the cart. Program the "add to cart button" to take the product id, finds the product object in the products array and adds it to the items added to cart array. Program the "remove from cart button" to take the product id and remove the project object from the items purchased array.
Existing code:
<!DOCTYPE html>
<html>
<head>
<div id="product1" class="card">
<img src="img/clorox.jpg">
<h1>Clorox</h1>
<p class="price">$20.00</p>
<p>Household Cleaner</p>
<p><button id="product1Btn1">Add to Cart</button></p>
<p><button id="product1Btn2">Remove from Cart</button></p>
</div>
<div id="product2" class="card">
<img src="img/oxiclean.jpg">
<h1>Oxiclean</h1>
<p class="price">$8.00</p>
<p>Household Cleaner</p>
<p><button id="product2Btn1">Add to Cart</button></p>
<p><button id="product2Btn2">Remove from Cart</button></p>
</div>
<div id="product3" class="card">
<img src="img/pinesol.jpg">
<h1>PineSol</h1>
<p class="price">$11.00</p>
<p>Household Cleaner</p>
<p><button id="product3Btn1">Add to Cart</button></p>
<p><button id="product3Btn2">Remove from Cart</button></p>
</div>
<div id="product4" class="card">
<img src="img/mrclean.jpg">
<h1>Mr Clean</h1>
<p class="price">$12.00</p>
<p>Household Cleaner</p>
<p><button id="product4Btn1">Add to Cart</button></p>
<p><button id="product4Btn2">Remove from Cart</button></p>
</div>
<div id="product5" class="card">
<img src="img/windex.jpg">
<h1>Windex</h1>
<p class="price">$15.00</p>
<p>Household Cleaner</p>
<p><button id="product5Btn1">Add to Cart</button></p>
<p><button id="product5Btn2">Remove from Cart</button></p>
</div>
</head>
</html>

Step by stepSolved in 3 steps with 2 images

- # file name: w07_markus.py## Complete the following steps:# (1) Complete the following function according to its docstring.# (2) Save your file after you make changes, and then run the file by# clicking on the green Run button in Wing101. This will let you call your# modified function in the Python shell. An asterisk * on the Wing101# w07_markus.py tab indicates that modifications have NOT been saved.# (3) Test your function in the Wing101 shell by evaluating the examples from# the docstring and confirming that the correct result is displayed.# (4) Test your function using different function arguments.# (5) When you are convinced that your function is correct, submit your# modified file to MarkUs. You can find instructions on submitting a file# to MarkUs in Week *2* Perform -> Accessing Part 2 of the# Week 2 Perform (For Credit) on PCRS.# (6) Verify you have submitted the right file to MarkUs by downloading it# and checking that the…arrow_forwardCreate a new javascript file called cart.js and make a product object for each of your products and store it in a products array when the script loads. Create an empty array to store the items added to the cart. Program the "add to cart button" to take the product id, finds the product object in the products array and adds it to the items added to cart array. Program the "remove from cart button" to take the product id and remove the project object from the items purchased array. Existing code: <!DOCTYPE html><html> <head> <div id="product1" class="card"><img src="img/clorox.jpg"><h1>Clorox</h1><p class="price">$20.00</p><p>Household Cleaner</p><p><button id="product1Btn1">Add to Cart</button></p><p><button id="product1Btn2">Remove from Cart</button></p></div> <div id="product2" class="card"><img src="img/oxiclean.jpg"><h1>Oxiclean</h1><p…arrow_forwardcreateDatabaseOfProfiles(String filename) This method creates and populates the database array with the profiles from the input file (profile.txt) filename parameter. Each profile includes a persons' name and two DNA sequences. 1. Reads the number of profiles from the input file AND create the database array to hold that number profiles. 2. Reads the profiles from the input file. 3. For each person in the file 1. creates a Profile object with the information from file (see input file format below). 2. insert the newly created profile into the next position in the database array (instance variable).arrow_forward
- This project involves generating a boarding pass ticket and storing it in a file. The application should take the passenger details as input. The details of the boarding pass are to be stored in a file. The details should include valid data such as: name, email, phone number, gender, age, boarding pass number, date, origin, destination, estimated time of arrival (ETA), departure time. The application should generate a boarding pass ticket using the boarding pass details. The generated ticket should contain the following information: Boarding Pass Number, Date, Origin, Destination, Estimated time of arrival (ETA), Departure Time Name, Email, Phone Number, Gender, Age Total Ticket Price The user will be required to enter their Name, Email, Phone Number, Gender, Age, Date, Destination, and Departure Time into the console or GUI. From the input the computer must generate the ETA and Ticket Price. The computer must generate the boarding pass number ensuring the number is unique. All…arrow_forwardManagement has given you the greenlight to create the product portion of the web application. Create a Product class with the following attributes: a. Price b. Name c. Description d. Id Create a ShoppingCart.js file and include it in the products page. In the script, create an empty array to store the items added to the cart. Create a products array and create a product object for each of your products and store it in the products array when the script loads. The shopping cart script should have the following functions: a. add - Takes an id, finds the product object in the products array and adds it to the items purchased array. b. remove - Takes an id and removes the corresponding object from the items purchased array. c. Returns html for displaying the items in the cart. Create a products.html page. Add 5 product images to the page. Under each product add an add to cart button. Make the id property of the button the id for the product.…arrow_forwardCODE SHOULD BE PYTHON:arrow_forward
- A bucket list is a collection of goals, dreams, and aspirations that you would like to accomplish within your lifetime. The purpose of this assignment is to develop a program that allows the user to manage their personal bucket list and save it to an XML file bucketlist.xml. For full credit, run the program and create a file with at least three entry elements. Submit a document containing a copy of the source file, a screenshot of the program in action, and the contents of the XML file. File Structure Below is the basic structure (i.e. schema) for the XML file. You may add additional elements. <bucketList> <entry> <rank></rank> <description></description> <status></status> </entry> </bucketList> Note: Before running the program, manually create an XML input file with at least one entry element that contains values in each child element. GUI Requirements At a minimum, your GUI must meet the below requirements. No minimize…arrow_forwardYou are given 2 text files named drywet.txt and wetwet.txt. wetwet.txt data file refers to the probability of next day being a wet day if the current day is wet. drywet.txt data file refers to the probability of next day being a wet day if the current day is dry. NOTE: the data for the same location in wetwet.txt and drywet.txt will have the same line number. These files are in the format of: (excerpt from wetwet.txt)-97.58 26.02 0.76 0.75 0.77 0.74 0.80 0.86 0.94 0.97 0.89 0.77 0.74 0.77 -97.19 26.03 0.73 0.76 0.75 0.71 0.79 0.85 0.92 0.95 0.90 0.81 0.76 0.75 -98.75 26.35 0.74 0.76 0.76 0.73 0.67 0.84 0.83 0.85 0.80 0.71 0.71 0.76 … In each line, the first and second numbers represent the location’s longitude and latitude. The following 12 numbers represent the probability of the next day being a wet day of the month. For example, on the first line of the excerpt above 0.75 means that in February (4th column), there is a 75% of chance that the next day is a wet day if today is a wet…arrow_forwardAdd a prompt to ask the user to input their last name (no spaces ; please use underscores if needed), age and a balance of their choice. Create a new entry in the patient_list array with this information [Important note: you can statically modify the code to have the patient_list array hold an extra entry ; no need to do any dynamic memory allocation to accommodate the new entry]. #include <iostream> #include <cstdlib> #include <cstring> using namespace std; // Declaring a new struct to store patient data struct patient { int age; char name[20]; float balance; }; // TODO: // IMPLEMENT A FUNCTION THAT COMPARES TWO PATIENTS BY AGE // THE FUNCTION RETURNS AN INTEGER AS FOLLOWS: // -1 IF THE AGE OF THE FIRST PATIENT IS LESS // THAN THE SECOND PATIENT'S AGE // 0 IF THE AGES ARE EQUAL // 1 OTHERWISE // TODO: // IMPLEMENT A FUNCTION THAT COMPARES TWO PATIENTS BY BALANCE DUE // THE FUNCTION RETURNS AN INTEGER AS…arrow_forward
- Codearrow_forwardObjectives: Construct and use 1D and 2D arrays Send arrays to methods Iterate through an array to perform a calculation Details:This assignment will be completed using the Eclipse IDE. Attach your .java file to the Assignment page. Which of the following five people is the most interesting famous computer scientist? Grace Hopper Ada Lovelace Katherine Johnson Frances Allen Shafi Goldwasser Let’s say that we ask a group of 20 people to vote for which one of the computer scientists is most interesting. Each voter votes for one candidate and, of course, we are interested in who wins. Our data is a matrix with each row representing one of the five computer scientists and each column representing one of the 20 voters. The data in the matrix consists of 1s and 0s. The number 1 in each column represents a vote for the candidate represented by that row. Here is an example matrix (the data matrix is just the numbers). Next to each row is the name of the computer scientist represented by…arrow_forwardYou have more flexibility to implement your own function names and logic in these programs. The data files you need for this assignment can obtained from:Right-click and "Save Link As..." HUGO_genes.txt (Links to an external site.) chr21_genes.txt (Links to an external site.) Create an output directory inside your assignment4 directory called "OUTPUT" for result files, so that they will not mix with your programs. Output from your programs will be here! Your program must implement command line options for the infiles it must open, but for testing purposes it should run by default, so if no command line option is passed at the command line, the program will still run. This will help in the grading of your program. Create a Python Module called called my_io.py - You can use the same code from assignment 3's solution. Put this my_io.py Module in a subdirectory named assignment4 inside your assignment4 top-level directory (see the tree below, and see Lecture 7 on how to implement a…arrow_forward
- Database System ConceptsComputer ScienceISBN:9780078022159Author:Abraham Silberschatz Professor, Henry F. Korth, S. SudarshanPublisher:McGraw-Hill EducationStarting Out with Python (4th Edition)Computer ScienceISBN:9780134444321Author:Tony GaddisPublisher:PEARSONDigital Fundamentals (11th Edition)Computer ScienceISBN:9780132737968Author:Thomas L. FloydPublisher:PEARSON
- C How to Program (8th Edition)Computer ScienceISBN:9780133976892Author:Paul J. Deitel, Harvey DeitelPublisher:PEARSONDatabase Systems: Design, Implementation, & Manag...Computer ScienceISBN:9781337627900Author:Carlos Coronel, Steven MorrisPublisher:Cengage LearningProgrammable Logic ControllersComputer ScienceISBN:9780073373843Author:Frank D. PetruzellaPublisher:McGraw-Hill Education





