Some experiments with web applications
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

150 lines
4.3 KiB

  1. // variable to en-/disable debug
  2. // set to 1 to enable debug log
  3. var DEBUG;
  4. // xmlhttp object function
  5. function getHTTPObject() {
  6. // debug log
  7. if (DEBUG === 1) {console.log("xml http object function");}
  8. var xhr;
  9. // check for availibility if xmlhttprequest object
  10. if(window.XMLHttpRequest) {
  11. xhr = new XMLHttpRequest();
  12. } else if(window.ActiveXObject) {
  13. xhr = new ActiveXObject("Msxml2.XMLHTTP");
  14. }
  15. return xhr;
  16. }
  17. // ajax call function
  18. function ajaxCall(dataUrl, outputElement, callback, responseType) {
  19. // debug log
  20. if (DEBUG === 1) {console.log("ajax function");}
  21. // get the xmlhttp object which is supported
  22. var request = getHTTPObject();
  23. outputElement.innerHTML = "Lade Daten ...";
  24. request.onreadystatechange = function() {
  25. if(request.readyState === 4 && request.status === 200) {
  26. //save ajax response
  27. if (responseType === "json") {
  28. var response = JSON.parse(request.responseText);
  29. } else if (responseType === "xml") {
  30. var response = request.responseXML;
  31. } else {
  32. var response = request.responseText;
  33. }
  34. // check if callback is a function
  35. if(typeof callback === "function") {
  36. callback(response);
  37. }
  38. }
  39. };
  40. request.open("get", dataUrl, true);
  41. request.send(null);
  42. }
  43. // wrap all in anonymous function to get out of global scope
  44. (function() {
  45. // debug log
  46. if (DEBUG === 1) {console.log("anonymous function");}
  47. // server url
  48. var origin = window.location.origin.indexOf("www.goodcleanfun.de");
  49. if (origin === -1) {
  50. var serverUrl = "http://goodcleanfun.de/cgi-bin/";
  51. } else {
  52. var serverUrl = "http://www.goodcleanfun.de/cgi-bin/";
  53. }
  54. // get the search form
  55. var searchForm = document.getElementById("search-form");
  56. // haltestelle object
  57. var haltestelle = {
  58. getInfo : function(event) {
  59. // debug log
  60. if (DEBUG === 1) {console.log("getInfo function");}
  61. // prevent submit default behaviour
  62. event.preventDefault();
  63. // get output area
  64. var target = document.getElementById("output");
  65. var hstName = document.getElementById("q").value;
  66. var hstUrl = encodeURI(serverUrl + "abfahrtsmonitor.py?ort=dresden&hst=" + hstName);
  67. ajaxCall(hstUrl, target, function(data) {
  68. // debug log
  69. if (DEBUG === 1) {console.log("received data: " + data);}
  70. data = data.replace(/\],\[/gi, '#');
  71. data = data.replace(/\(.+?\)/gi, '');
  72. data = data.replace('ß', 'ss');
  73. data = data.replace(/<(.+?)>/gi, '$1');
  74. data = data.slice(3,-3).split("#");
  75. // debug log
  76. if (DEBUG === 1) {console.log("parsed data: " + data);}
  77. var i;
  78. var y;
  79. var htmlOutput;
  80. var dataLength = data.length;
  81. // generate table header
  82. htmlOutput = "<table>";
  83. htmlOutput += "<tr>";
  84. htmlOutput += "<th>Linie</th>";
  85. htmlOutput += "<th>Richtung</th>";
  86. htmlOutput += "<th>Abfahrt</th>";
  87. htmlOutput += "</tr>";
  88. // generate table entries
  89. for (i = 0; i < dataLength; i++) {
  90. htmlOutput += "<tr>";
  91. var entry = data[i].split(",");
  92. // debug log
  93. if (DEBUG === 1) {console.log("part " + i + " of parsed data: " + entry);}
  94. for (y = 0; y < 3; y++) {
  95. // debug log
  96. if (DEBUG === 1) {console.log("part " + y + ": " + entry[y]);}
  97. htmlOutput += "<td>" + entry[y].slice(1,-1) + "</td>";
  98. }
  99. htmlOutput += "</tr>";
  100. }
  101. // close table
  102. htmlOutput += "</table>";
  103. // print table into web page
  104. target.innerHTML = htmlOutput;
  105. }, "text");
  106. }
  107. };
  108. //event listeners
  109. searchForm.addEventListener("submit", haltestelle.getInfo, false);
  110. })(); // end of anonymous function