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.

122 lines
3.2 KiB

  1. // server url
  2. var serverUrl = "http://widgets.vvo-online.de/abfahrtsmonitor/";
  3. // xmlhttp object function
  4. function getHTTPObject() {
  5. console.log("xml http object function");
  6. var xhr;
  7. if(window.XMLHttpRequest) {
  8. xhr = new XMLHttpRequest();
  9. } else if(window.ActiveXObject) {
  10. xhr = new ActiveXObject("Msxml2.XMLHTTP");
  11. }
  12. return xhr;
  13. }
  14. // ajax call function
  15. function ajaxCall(dataUrl, outputElement, callback) {
  16. console.log("ajax function");
  17. // get the xmlhttp object which is supported
  18. var request = getHTTPObject();
  19. outputElement.innerHTML = "Lade Daten ...";
  20. request.onreadystatechange = function() {
  21. if(request.readyState === 4 && request.status === 200) {
  22. //save ajax response
  23. var response = request.responseText;
  24. // check if callback is a function
  25. if(typeof callback === "function") {
  26. callback(response);
  27. }
  28. }
  29. };
  30. request.open("get", dataUrl, true);
  31. request.send(null);
  32. }
  33. // wrap all in anonymous function to get out of global scope
  34. (function() {
  35. console.log("anonymous function");
  36. /*var wurst = '[["13","Prohlis","754"],["13","Prohlis","754"],["13","Prohlis","754"],["13","Prohlis","754"]]';
  37. console.log(wurst);
  38. //wurst = wurst.replace(/\[\[/gi, '[');
  39. //wurst = wurst.replace(/\]\]/gi, ']');
  40. wurst = wurst.replace(/\],\[/gi, '#');
  41. wurst = wurst.slice(2,-2);
  42. console.log(wurst);
  43. console.log(wurst.split("#"));*/
  44. // get the search form
  45. var searchForm = document.getElementById("search-form");
  46. // haltestelle object
  47. var haltestelle = {
  48. getInfo : function(event) {
  49. console.log("getInfo function");
  50. // prevent submit default behaviour
  51. event.preventDefault();
  52. // get output area
  53. var target = document.getElementById("output");
  54. var hstName = document.getElementById("q").value;
  55. var hstUrl = serverUrl + "Abfahrten.do?ort=dresden&hst=" + hstName;
  56. ajaxCall(hstUrl, target, function(data) {
  57. data = data.replace(/\],\[/gi, '#');
  58. data = data.slice(2,-2);
  59. data = data.split("#");
  60. var i;
  61. var y;
  62. var htmlOutput;
  63. var dataLength = data.length;
  64. htmlOutput = "<table>";
  65. htmlOutput += "<tr>";
  66. htmlOutput += "<th>Linie</th>";
  67. htmlOutput += "<th>Richtung</th>";
  68. htmlOutput += "<th>Abfahrt</th>";
  69. htmlOutput += "</tr>";
  70. for (i = 0; i < dataLength; i++) {
  71. htmlOutput += "<tr>";
  72. for (y = 0; y < 3; y++) {
  73. htmlOutput += "<td>" + data[i][y] + "</td>";
  74. }
  75. htmlOutput += "</tr>";
  76. }
  77. htmlOutput += "</table>";
  78. // print table into web page
  79. target.innerHTML = htmlOutput;
  80. });
  81. }
  82. };
  83. //event listeners
  84. searchForm.addEventListener("submit", haltestelle.getInfo, false);
  85. })(); // end of anonymous function