Advertisement
Guest User

Untitled

a guest
Apr 4th, 2018
193
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
PHP 22.06 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <!--http://www.scs.ryerson.ca/~p2andreo/CPS630/Assignment/CPS630/assign1.php-->
  4.  
  5.     <head>
  6.         <meta charset="UTF-8">
  7.         <title>Art Gallery</title>
  8.         <link rel="stylesheet" type="text/css" href="assign1.css">
  9.     <!--<script src="art.js"></script>-->
  10.  
  11.  
  12.     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  13.   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  14.   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  15.  
  16.     </head>
  17.      
  18.     <body>
  19.         <?php
  20.             //include 'Database.php';
  21.             require('Database.php');
  22.             $servername = "localhost";
  23.             $username = "p2andreo";
  24.             $password = "Ciwowrav";
  25.             $dbname = "p2andreo";
  26.             $connection = new mysqli($servername, $username, $password, $dbname);
  27.             if ($conn->connect_error) {
  28.                     die("Connection failed: " . $conn->connect_error);
  29.  
  30.             }
  31.  
  32.             /*$result = $connection->query("select * from artists");
  33.             while($row = $result->fetch_assoc()) {
  34.                 echo $row['artistId'];
  35.             }*/
  36.             //$thisDb = new Database($servername, $username, $password, $dbname);
  37.                 $thisDb = new Database($connection);
  38.  
  39.  
  40.         ?>
  41.         <script>
  42.                 var selectedArt = "";
  43.                 var purchasedArt = [];
  44.  
  45.  
  46.  
  47.                 function setPurchase(){
  48.                     var staticName = document.getElementById('staticPaintingName');
  49.                     var dynamicName = document.getElementById('dynamicPaintingName');
  50.                     var quantity = document.getElementById("purchaseQuantity");
  51.                     var ship1 = document.getElementById("ship1");
  52.                     var ship2 = document.getElementById("ship2");
  53.                     var ship3 = document.getElementById("ship3");
  54.                     var details = [];
  55.                     if(staticName.style.visibility == "visible"){
  56.                         details["name"] = staticName.innerHTML;
  57.                     }else{
  58.                         details["name"] = dynamicName.value;
  59.                     }
  60.                     if(details["name"] == "Monal Lisa") details["price"] = 800000000;
  61.                     else if(details["name"] == "The Night Watch") details["price"] = 23000;
  62.                     else if(details["name"] == "Third Class Carriage") details["price"] = 40000;
  63.                     else if(details["name"] == "The Starry Night") details["price"] = 150000000;
  64.                     else if(details["name"] == "Guernica") details["price"] = 179000000;
  65.                     else details["price"] = 0;
  66.                     if(parseInt(quantity.value) > 0){
  67.                         details["quantity"] = parseInt(quantity.value);
  68.                     }
  69.                     if(ship1.checked){
  70.                         details["shipping"] = 4.99;
  71.  
  72.                     }else if(ship2.checked){
  73.                         details["shipping"] = 14.99;
  74.                     }else{
  75.                         details["shipping"] = 39.99;
  76.                     }
  77.                    
  78.                     purchasedArt.push(details);
  79.                     console.log(details);
  80.                     //return true;
  81.                 }
  82.                 function calcInvoice(){
  83.                     var total = 0;
  84.                    
  85.                     if(purchasedArt.length > 0){
  86.                         console.log(purchasedArt);
  87.                         for(var i = 0; i < purchasedArt.length; i++){
  88.                            
  89.                             total += (purchasedArt[i]["quantity"] * purchasedArt[i]["price"]) + purchasedArt[i]["shipping"];
  90.                         }
  91.                     }
  92.                     document.getElementById("invoice").innerHTML = "Your total so far is: " + toString(total);
  93.                 }
  94.                 function openModalByShoppingCart(){
  95.                     document.getElementById('myModal').style.visibility='visible';
  96.                     document.getElementById('staticPaintingName').style.visibility='hidden';
  97.                     document.getElementById('dynamicPaintingName').style.visibility='visible';
  98.  
  99.                 }
  100.                 function openModal(){
  101.                     document.getElementById('myModal').style.visibility='visible';
  102.                     document.getElementById('staticPaintingName').style.visibility='visible';
  103.                     document.getElementById('dynamicPaintingName').style.visibility='hidden';
  104.                     document.getElementById('selectedPaintingName').innerHTML = selectedArt;
  105.                 }
  106.                 function artwork1() {
  107.                     <?php $result = $thisDb->fetchArtData(1); ?>
  108.                     document.getElementById("ArtSection").style.visibility = "visible";
  109.                     document.getElementById("ArtSection2").style.visibility = "hidden";
  110.                     document.getElementById("artImage").src = <?php echo "\"" . $result["imagePath"] . "\"";?>;
  111.                     document.getElementById("artDescription").innerHTML = "Name: <a><span onClick='showArt1()'><?php echo $result["name"];?> </span></a> </br> Description:  <?php echo $result["shortDescription"];?><br>Price: $<?php echo $result["price"];?>";
  112.                 }
  113.  
  114.                 function showArt1() {
  115.                     <?php $result = $thisDb->fetchArtData(1); ?>
  116.                     document.getElementById("ArtSection").style.visibility = "hidden";
  117.                     document.getElementById("ArtSection2").style.visibility = "visible";
  118.                     document.getElementById("artImage2").src = "<?php echo $result["imagePath"];?>";
  119.                     document.getElementById("artDescription2").innerHTML = "<?php echo $result["longDescription"];?>Price: $<?php echo $result["price"];?><br>Genre: Portrait";
  120.                     selectedArt = "Monal Lisa";
  121.                 }
  122.  
  123.                 function artwork2() {
  124.                     <?php $result = $thisDb->fetchArtData(2); ?>
  125.                     document.getElementById("ArtSection").style.visibility = "visible";
  126.                     document.getElementById("ArtSection2").style.visibility = "hidden";
  127.                     document.getElementById("artImage").src = "<?php echo $result["imagePath"];?>";
  128.                     document.getElementById("artDescription").innerHTML = "Name: <a><span onClick='showArt2()'><?php echo $result["name"];?></span></a> </br> Description: <?php echo $result["shortDescription"];?>  <br>Price: $<?php echo $result["price"];?>";
  129.                 }
  130.                 <?php unset($result); ?>
  131.  
  132.                 function showArt2() {
  133.                     <?php $result = $thisDb->fetchArtData(2); ?>
  134.                     document.getElementById("ArtSection").style.visibility = "hidden";
  135.                     document.getElementById("ArtSection2").style.visibility = "visible";
  136.                     document.getElementById("artImage2").src = "<?php echo $result["imagePath"];?>";
  137.                     document.getElementById("artDescription2").innerHTML = "<?php echo $result["longDescription"];?>Price: $<?php echo $result["price"];?><br>Genre: Baroque";
  138.                     selectedArt = "The Night Watch";
  139.                 }
  140. <?php unset($result); ?>
  141.                 function artwork3() {
  142.                     <?php $result = $thisDb->fetchArtData(3); ?>
  143.                     document.getElementById("ArtSection").style.visibility = "visible";
  144.                     document.getElementById("ArtSection2").style.visibility = "hidden";
  145.                     document.getElementById("artImage").src = "<?php echo $result["imagePath"];?>";
  146.                     document.getElementById("artDescription").innerHTML = "Name: <a><span onClick='showArt3()'><?php echo $result["name"];?></span></a> </br> Description: <?php echo $result["shortDescription"];?>  <br>Price: $<?php echo $result["price"];?>";
  147.                 }
  148. <?php unset($result); ?>
  149.                 function showArt3() {
  150.                     <?php $result = $thisDb->fetchArtData(3); ?>
  151.                     document.getElementById("ArtSection").style.visibility = "hidden";
  152.                     document.getElementById("ArtSection2").style.visibility = "visible";
  153.                     document.getElementById("artImage2").src = "<?php echo $result["imagePath"];?>";
  154.                     document.getElementById("artDescription2").innerHTML = "<?php echo $result["longDescription"];?>Price: $<?php echo $result["price"];?><br>Genre: Realism";
  155.                     selectedArt = "Third Class Carriage";
  156.                 }
  157. <?php unset($result); ?>
  158.                 function artwork4() {
  159.                     <?php $result = $thisDb->fetchArtData(4); ?>
  160.                     document.getElementById("ArtSection").style.visibility = "visible";
  161.                     document.getElementById("ArtSection2").style.visibility = "hidden";
  162.                     document.getElementById("artImage").src = "<?php echo $result["imagePath"];?>";
  163.                     document.getElementById("artDescription").innerHTML = "Name: <a><span onClick='showArt4()'><?php echo $result["name"];?></span></a> </br> Description: <?php echo $result["shortDescription"];?>  <br>Price: $<?php echo $result["price"];?>";
  164.                 }
  165. <?php unset($result); ?>
  166.                 function showArt4() {
  167.                     <?php $result = $thisDb->fetchArtData(4); ?>
  168.                     document.getElementById("ArtSection").style.visibility = "hidden";
  169.                     document.getElementById("ArtSection2").style.visibility = "visible";
  170.                     document.getElementById("artImage2").src = "<?php echo $result["imagePath"];?>";
  171.                     document.getElementById("artDescription2").innerHTML = "<?php echo $result["longDescription"];?>Price: $<?php echo $result["price"];?><br>Genre: Landscape";
  172.                     selectedArt = "The Starry Night";
  173.                 }
  174. <?php unset($result); ?>
  175.                 function artwork5() {
  176.                     <?php $result = $thisDb->fetchArtData(5); ?>
  177.                     document.getElementById("ArtSection").style.visibility = "visible";
  178.                     document.getElementById("ArtSection2").style.visibility = "hidden";
  179.                     document.getElementById("artImage").src = "<?php echo $result["imagePath"];?>";
  180.                     document.getElementById("artDescription").innerHTML = "Name: <a><span onClick='showArt5()'><?php echo $result["name"];?></span></a> </br> Description: <?php echo $result["shortDescription"];?>  <br>Price: $<?php echo $result["price"];?>";
  181.  
  182.                 }
  183. <?php unset($result); ?>
  184.                 function showArt5() {
  185.                     <?php $result = $thisDb->fetchArtData(5); ?>
  186.                     document.getElementById("ArtSection").style.visibility = "hidden";
  187.                     document.getElementById("ArtSection2").style.visibility = "visible";
  188.                     document.getElementById("artImage2").src = "<?php echo $result["imagePath"];?>";
  189.                     document.getElementById("artDescription2").innerHTML = "<?php echo $result["longDescription"];?>Price: $<?php echo $result["price"];?><br>Genre: Abstract";
  190.                     selectedArt = "Guernica";
  191.                 }
  192.  
  193.  
  194.                     function artist1() {
  195.                     document.getElementById("ArtSection").style.visibility = "visible";
  196.                     document.getElementById("ArtSection2").style.visibility = "hidden";
  197.                     document.getElementById("artImage").src = "Resources/raph.jpg";
  198.                     document.getElementById("artDescription").innerHTML = "Name: <a><span onClick='showArtist1()'> Raphael Sanzio da Urbino</span></a> </br> Description: Raffaello Sanzio da Urbino, known as Raphael, was an Italian painter and architect of the High Renaissance. His work is admired for its clarity of form, ease of composition, and visual achievement of the Neoplatonic ideal of human grandeur.";
  199.                 }
  200.  
  201.                 function showArtist1() {
  202.                     document.getElementById("ArtSection").style.visibility = "hidden";
  203.                     document.getElementById("ArtSection2").style.visibility = "visible";
  204.                     document.getElementById("artImage2").src = "Resources/raph.jpg";
  205.                     document.getElementById("artDescription2").innerHTML = "Date of birth: 1483<br> deathof the artist: 1520<br> Place of his/her living: Urbino, Italy<br> Genres of his/her paintings(e.g. Gothic, Renaissance, Baroque, Pre-Modern, and Modern): Baroque, Renaissance<br> Famous of his/her piece of works: \"The School of Athens\", \"The Sistine Madonna\", \"The Marriage of the Virgin\"";
  206.                 }
  207.  
  208.                 function artist2() {
  209.                     document.getElementById("ArtSection").style.visibility = "visible";
  210.                     document.getElementById("ArtSection2").style.visibility = "hidden";
  211.                     document.getElementById("artImage").src = "Resources/vinci.jpg";
  212.                     document.getElementById("artDescription").innerHTML = "Name: <a><span onClick='showArtist2()'> Leonardo di ser Piero da Vinci</span></a> </br> Description: Leonardo di ser Piero da Vinci, more commonly Leonardo da Vinci or simply Leonardo, was an Italian Renaissance polymath whose areas of interest included invention, painting, sculpting, architecture.";
  213.                 }
  214.  
  215.                 function showArtist2() {
  216.                     document.getElementById("ArtSection").style.visibility = "hidden";
  217.                     document.getElementById("ArtSection2").style.visibility = "visible";
  218.                     document.getElementById("artImage2").src = "Resources/vinci.jpg";
  219.                     document.getElementById("artDescription2").innerHTML = "Date of birth: 1452<br> Death of the artist: 1519<br> Place of his/her living: Anchiano, Italy<br> Genres of his/her paintings(e.g. Gothic, Renaissance, Baroque, Pre-Modern, and Modern): Renaissance<br> Famous of his/her piece of works: \"Mona Lisa\", \"The Last Supper\", \"St. John the Baptist\"";
  220.                 }
  221.  
  222.                 function artist3() {
  223.                     document.getElementById("ArtSection").style.visibility = "visible";
  224.                     document.getElementById("ArtSection2").style.visibility = "hidden";
  225.                     document.getElementById("artImage").src =  "Resources/rembrandt.jpg";
  226.                     document.getElementById("artDescription").innerHTML = "Name: <a><span onClick='showArtist3()'> Rembrandt Harmenszoon van Rjin</span></a> </br> Description:  was a Dutch draughtsman, painter, and printmaker. An innovative and prolific master in three media,[3] he is generally considered one of the greatest visual artists in the history of art and the most important in Dutch art history.";
  227.                 }
  228.  
  229.                 function showArtist3() {
  230.                     document.getElementById("ArtSection").style.visibility = "hidden";
  231.                     document.getElementById("ArtSection2").style.visibility = "visible";
  232.                     document.getElementById("artImage2").src = "Resources/rembrandt.jpg";
  233.                     document.getElementById("artDescription2").innerHTML = "Date of birth: 1606<br> Death of the artist: 1669<br> Place of his/her living: Leiden, Netherlands<br> Genres of his/her paintings(e.g. Gothic, Renaissance, Baroque, Pre-Modern, and Modern): Baroque, Realism, Post-Impressionism<br> Famous of his/her piece of works: \"The Night Watch\", \"The Return of the Prodigal\", \"The Jewish Bride\"";
  234.                 }
  235.  
  236.                 function artist4() {
  237.                     document.getElementById("ArtSection").style.visibility = "visible";
  238.                     document.getElementById("ArtSection2").style.visibility = "hidden";
  239.                     document.getElementById("artImage").src =  "Resources/picasso.jpg";
  240.                     document.getElementById("artDescription").innerHTML = "Name: <a><span onClick='showArtist4()'> Pablo Picasso</span></a> </br> Description: Pablo Picasso was a Spanish painter, sculptor, printmaker, ceramicist, stage designer, poet and playwright who spent most of his adult life in France.";
  241.                 }
  242.  
  243.                 function showArtist4() {
  244.                     document.getElementById("ArtSection").style.visibility = "hidden";
  245.                     document.getElementById("ArtSection2").style.visibility = "visible";
  246.                     document.getElementById("artImage2").src = "Resources/picasso.jpg";
  247.                     document.getElementById("artDescription2").innerHTML = "Date of birth: 1881<br> Death of the artist: 1973<br> Place of his/her living: Malaga, Spain<br> Genres of his/her paintings(e.g. Gothic, Renaissance, Baroque, Pre-Modern, and Modern): Cubism, Surrealism, Expressionism, Post=Post-Impressionism<br> Famous of his/her piece of works: \"Guernica\", \"Les Demoiselles d'Avignon\", \"The Old Guitarist\"";
  248.                 }
  249.  
  250.                 function artist5() {
  251.                     document.getElementById("ArtSection").style.visibility = "visible";
  252.                     document.getElementById("ArtSection2").style.visibility = "hidden";
  253.                     document.getElementById("artImage").src =  "Resources/angelo.jpg";
  254.                     document.getElementById("artDescription").innerHTML = "Name: <a><span onClick='showArtist5()'> Michelangelo</span></a> </br> Description: was an Italian sculptor, painter, architect and poet of the High Renaissance born in the Republic of Florence, who exerted an unparalleled influence on the development of Western art";
  255.                 }
  256.  
  257.                 function showArtist5() {
  258.                     document.getElementById("ArtSection").style.visibility = "hidden";
  259.                     document.getElementById("ArtSection2").style.visibility = "visible";
  260.                     document.getElementById("artImage2").src = "Resources/angelo.jpg";
  261.                     document.getElementById("artDescription2").innerHTML = "Date of birth: 1475<br> Death of the artist: 1564<br> Place of his/her living: Caprese Michelangelo, Italy<br> Genres of his/her paintings(e.g. Gothic, Renaissance, Baroque, Pre-Modern, and Modern): High Renaissance, Italian Renaissance, Renaissance<br> Famous of his/her piece of works: \"Sistine Chapel ceiling\", \"The Last Judgment\", \"David\"";
  262.                 }
  263.  
  264.  
  265.  
  266.  
  267.                 function smallData(name) {
  268.                     document.getElementById("ArtSection").style.visibility = "visible";
  269.                     var artsrc = "";
  270.                     var description = "";
  271.                     /*Artist Switch*/
  272.                 }
  273.                 function showData(name) {
  274.                                 document.getElementById("ArtSection").style.visibility = "visible";
  275.                                 var artsrc = "";
  276.                                 var description = "";
  277.                                 /*Artist Switch*/
  278.                                
  279.                                 /*Museum Switch*/
  280.                                 switch (name){
  281.                                     case "The Louvre":
  282.                                         artsrc = "Resources/Louvre.jpg";
  283.                                         description = "Description: The Louvre Palace is a former royal palace located on the Right Bank of the Seine in Paris, between the Tuileries Gardens and the church of Saint-Germain l'Auxerrois.";
  284.                                         break;
  285.                                     case "Metropolitan Museum of Art":
  286.                                         artsrc = "Resources/met-museum.jpg";
  287.                                         description = "Description: The Metropolitan Museum of Art of New York, colloquially 'the Met', is the largest art museum in the United States.";
  288.                                         break;
  289.                                     case "Hermitage Museum":
  290.                                         artsrc = "Resources/hermitage.jpg";
  291.                                         description = "Description: The State Hermitage Museum is a museum of art and culture in Saint Petersburg, Russia. The second largest in the world,";
  292.                                         break;
  293.                                     case "British Museum":
  294.                                         artsrc = "Resources/british.jpg";
  295.                                         description = "Description: The British Museum, located in the Bloomsbury area of London, United Kingdom, is a public institution dedicated to human history, art and culture.";
  296.                                         break;
  297.                                     case "Art Institute of Chicago":
  298.                                         artsrc = "Resources/chicago.jpg";
  299.                                         description = "Description: The Art Institute of Chicago, founded in 1879 and located in Chicago's Grant Park, is one of the oldest and largest art museums in the United States";
  300.                                         break;
  301.                                 }
  302.                                 document.getElementById("artImage").src = artsrc;
  303.                                 document.getElementById("info").innerHTML = description;
  304.                             }
  305.  
  306.  
  307.  
  308.  
  309.             </script>
  310.        
  311.         <div>
  312.             <a style="text-decoration: none" href="">
  313.                 <button>Home</button>
  314.             </a>
  315.             <a style="text-decoration: none" href="">
  316.                 <button>About Us</button>
  317.             </a>
  318.             <a style="text-decoration: none" href="">
  319.                 <button>Blogs</button>
  320.             </a>
  321.  
  322.             <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal" onclick="openModalByShoppingCart();"><img src="Resources/shopping-cart.svg" width="10%" height="10%"></button>
  323.         </div>
  324.  
  325.         <br>
  326.         <!--Group Table-->
  327.         <table border="1">
  328.             <tr>
  329.                 <td>
  330.                     <h1>Group 50</h1>
  331.                 </td>
  332.             </tr>
  333.             <tr>
  334.                 <td>
  335.                     Pietro Andreoli 500639696
  336.                 </td>
  337.             </tr>
  338.             <tr>
  339.                 <td>
  340.                     Shehzad Muhammad 500592053
  341.                 </td>
  342.             </tr>
  343.         </table>
  344.         <br>
  345.      
  346.         <!--Art Dropdown Menu-->
  347.         <div class="dropdown">
  348.             <button class="dropbtn">Art Works</button>
  349.             <div class="dropdown-content">
  350.                 <a href="#" onclick="artwork1()">Mona Lisa</a>
  351.                 <a href="#" onclick="artwork2()">The Night Watch</a>
  352.                 <a href="#" onclick="artwork3()">Third Class Carriage</a>
  353.                 <a href="#" onclick="artwork4()">The Starry Night</a>
  354.                 <a href="#" onclick="artwork5()">Guernica</a>
  355.             </div>
  356.  
  357.         </div>
  358.     <!--Artist Dropdown Menu-->
  359.         <div class="drop2">
  360.             <button class="btn2">Artist</button>
  361.             <div class="drop2-content">
  362.                 <a href="#" onclick="artist1()">Raphael Sanzio da Urbino</a>
  363.                 <a href="#" onclick="artist2()">Leonardo di ser Piero da Vinci</a>
  364.                 <a href="#" onclick="artist3()">Rembrandt Harmenszoon van Rjin</a>
  365.                 <a href="#" onclick="artist4()">Pablo Picasso</a>
  366.                 <a href="#" onclick="artist5()"> Michelangelo di Lodovico Buonarroti Simoni </a>
  367.             </div>
  368.         </div>
  369.     <!--Museum Dropdown Menu-->
  370.         <div class="drop2">
  371.             <button class="btn2">Museum</button>
  372.             <div class="drop2-content">
  373.                 <a href="#" onclick="showData('The Louvre')">The Louvre</a>
  374.                 <a href="#" onclick="showData('Metropolitan Museum of Art')">Metropolitan Museum of Art</a>
  375.                 <a href="#" onclick="showData('Hermitage Museum')">Hermitage Museum</a>
  376.                 <a href="#" onclick="showData('British Museum')">British Museum</a>
  377.                 <a href="#" onclick="showData('Art Institute of Chicago')">Art Institute of Chicago</a>
  378.             </div>
  379.         </div>
  380.         <br>
  381.         <br>
  382.         <!--Info Container-->
  383.         <div id="ArtSection" style="visibility: hidden;">
  384.             <div id="image">
  385.                 <img id="artImage" src="" width="200px" height="200px">
  386.             </div>
  387.             <div id="info">
  388.                 <p id="artDescription"></p>
  389.             </div>
  390.         </div>
  391.  
  392.         <div id="ArtSection2" style="visibility: hidden;">
  393.             <div id="image">
  394.                 <img id="artImage2" src="" width="100%" height="100%">
  395.             </div>
  396.             <div id="info">
  397.                 <p id="artDescription2"></p>
  398.                   <!-- Trigger the modal with a button -->
  399.                 <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal" onclick="openModal();">Open Modal</button>
  400.  
  401.                
  402.         </div>
  403. <!-- Modal -->
  404.                 <div style="visibility: hidden;" class="modal fade" id="myModal" role="dialog">
  405.                     <div class="modal-dialog">
  406.  
  407.                     <!-- Modal content-->
  408.                     <div class="modal-content">
  409.                         <div class="modal-header">
  410.                             <button type="button" class="close" data-dismiss="modal">&times;</button>
  411.                             <h4 class="modal-title">Modal Header</h4>
  412.                         </div>
  413.                     <div class="modal-body">
  414.                         <form onsubmit="setPurchase()">
  415.                             Painting:
  416.                             <div id="staticPaintingName">
  417.                                 <p id="selectedPaintingName"></p>
  418.                             </div>
  419.                             <div >
  420.                                 <select id="dynamicPaintingName" name="paintings">
  421.                                     <option value="The Starry Night">The Starry Night</option>
  422.                                     <option value="The Night Watch">The Night Watch</option>
  423.                                     <option value="Third Class Carriage">Third Class Carriagef</option>
  424.                                     <option value="Guernica">Guernica</option>
  425.                                     <option value="Mona Lisa">Mona Lisa</option>
  426.                                 </select>
  427.                             </div>
  428.                             <br />
  429.                             <br />
  430.                             Quantity: <input type="number" id="purchaseQuantity" name="quantity" min="1" max="5" value="0">
  431.                             <br />
  432.                             Shipping Plan: <br/>
  433.                             <input id="ship1" type="radio" name="shippingPlan" value="standard" checked>Standard (2-3 weeks): $4.99 <br/>
  434.                             <input id="ship2" type="radio" name="shippingPlan" value="express">Express (2-5 days): $14.99 <br/>
  435.                             <input id="ship3" type="radio" name="shippingPlan" value="nextDay">Next Day: $39.99 <br />
  436.                             <br>
  437.                             <button onclick="calcInvoice();">Calculate Invoice</button>
  438.                             <br>
  439.                             <p id="invoice"></p>
  440.                             <br>
  441.  
  442.                             <input type="submit" value="Submit" >
  443.                             <input type="reset">
  444.                         </form>
  445.    
  446.                     </div>
  447.                     <div class="modal-footer">
  448.                         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
  449.                     </div>
  450.                 </div>
  451.             </div>
  452.            
  453.     </body>
  454.  
  455. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement