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.

88 lines
2.0 KiB

12 years ago
12 years ago
12 years ago
12 years ago
12 years ago
12 years ago
  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. // get the search form
  37. var searchForm = document.getElementById("search-form");
  38. // haltestelle object
  39. var haltestelle = {
  40. getInfo : function(event) {
  41. console.log("getInfo function");
  42. // prevent submit default behaviour
  43. event.preventDefault();
  44. // get output area
  45. var target = document.getElementById("output");
  46. var hstName = document.getElementById("q").value;
  47. var hstUrl = serverUrl + "Abfahrten.do?ort=dresden&hst=" + hstName;
  48. ajaxCall(hstUrl, target, function(data) {
  49. target.innerHTML = "";
  50. target.innerHTML = "<p>" + data + "</p>";
  51. });
  52. }
  53. };
  54. //event listeners
  55. searchForm.addEventListener("submit", haltestelle.getInfo, false);
  56. })(); // end of anonymous function