csv_to_table.html 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <link rel="stylesheet" type="text/css" href="static/styles.css">
  5. <title> Rupee to Dollar </title>
  6. <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/emailjs-com@2.3.2/dist/email.min.js"></script>
  7. <script type="text/javascript">
  8. (function(){
  9. emailjs.init("<YOUR_EMAIL_KEY>");
  10. })();
  11. </script>
  12. <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
  13. <script src="https://cdnjs.cloudflare.com/ajax/libs/PapaParse/5.0.2/papaparse.js"></script>
  14. <script src= "static/table_format_convert.js"></script>
  15. </head>
  16. <body><br>
  17. <h2> Rupee to Dollar Converter </h2>
  18. <br>
  19. <form class="form-inline">
  20. <input class="input input1" id="fileupload" name="myfile" type="file" accept=".csv" required/>
  21. <button class="button button1" type="submit" id="submit-file"> Upload CSV </button>
  22. </form>
  23. <br><br>
  24. <div id = "converted_table"></div>
  25. <br>
  26. <form id="send_mail">
  27. <input class="input inputemail" id = "email" type="text" placeholder="Email_ID" required>
  28. <tab2><button class="button button1" onclick="send_email()" type="submit" id="submit" > Submit </button></tab2>
  29. </form>
  30. </body>
  31. </html>
  32. <script type="text/javascript">
  33. var table;
  34. var converted_csv;
  35. var dollar_rate;
  36. var timestamp;
  37. var csv_list = new Array();
  38. fetch('http://api.currencylayer.com/live?access_key=<YOUR_CURRENCYAPI_KEY>')
  39. .then(response => response.json())
  40. .then(function(response) {
  41. console.log(response)
  42. dollar_rate = response.quotes.USDINR;
  43. timestamp = response.timestamp; // unix timestamp is stored
  44. })
  45. .catch(error => console.error(error));
  46. $(document).ready(function(){
  47. $('#submit-file').on("click",function(e){
  48. e.preventDefault();
  49. $('#fileupload').parse({
  50. config: {
  51. delimiter: "auto",
  52. complete: displayHTMLTable,
  53. },
  54. before: function(file, inputElem)
  55. {
  56. },
  57. error: function(err, file)
  58. {
  59. console.log("CSV file is in incorrect format")
  60. },
  61. complete: function()
  62. {
  63. console.log("Done with all files");
  64. }
  65. });
  66. });
  67. function displayHTMLTable(results){
  68. var table = "Converted USD Table<br><br><table class='table table-dark'>";
  69. var data = results.data;
  70. csv_list = [];
  71. for(i=0;i<data.length;i++){
  72. table+= "<tr>";
  73. var row = data[i];
  74. var cells = row.join(",").split(",");
  75. for(j=0;j<cells.length;j++){
  76. table+= "<td>$";
  77. table+= (Number(cells[j])/dollar_rate).toFixed(3);
  78. converted_csv += String((Number(cells[j])/dollar_rate).toFixed(3)) + ", ";
  79. csv_list.push((Number(cells[j])/dollar_rate).toFixed(3))
  80. table+= "</th>";
  81. }
  82. table+= "</tr>";
  83. converted_csv += "\n"
  84. }
  85. table+= "</table>";
  86. table += ("<br><p> Dollar Rate : "+ dollar_rate +"<tab2>");
  87. time_stamp = new Date(timestamp*1000).toLocaleTimeString("en-IN") + " " + new Date(timestamp*1000).toLocaleDateString("en-IN")
  88. table += ("Fetching time : "+ time_stamp);
  89. table += "</tab2><br><br>Min : " + String(Math.min(...csv_list));
  90. table += "<tab2>Max : " + String(Math.max(...csv_list));
  91. var total=0;
  92. for(var i in csv_list) { total += Number(csv_list[i]); }
  93. table += "</tab2><tab2>Avg : " + String((total / csv_list.length).toFixed(2)) + "</tab2>";
  94. $("#converted_table").html(table);
  95. };
  96. });
  97. function send_email(){
  98. var param = { email : document.querySelector('#email').value, converted : converted_csv };
  99. emailjs.send('gmail', 'send_converted_csv', param);
  100. alert("Mail has been sent successfully to your email id.")
  101. };
  102. </script>