Browse Source

initial commit

T. Meissner 6 years ago
commit
60d0b76e13
3 changed files with 126 additions and 0 deletions
  1. 3
    0
      .gitignore
  2. 27
    0
      dvb-app/index.html
  3. 96
    0
      dvb-app/scripts/haltestellen.js

+ 3
- 0
.gitignore View File

@@ -0,0 +1,3 @@
1
+.DS_Store
2
+*.swp
3
+*.*#*

+ 27
- 0
dvb-app/index.html View File

@@ -0,0 +1,27 @@
1
+<!DOCTYPE html>
2
+<html>
3
+
4
+<head>
5
+    <meta charset="utf-8">
6
+    <title>DVB Abfahrtsmonitor</title>
7
+</head>
8
+
9
+<body>
10
+
11
+    <form action="" method="get" id="search-form">
12
+        <div class="section">
13
+            <label for="q">Haltestelle</label>
14
+            <input type="search" id="q" name="q" required placeholder="Haltestelle eingeben">
15
+        </div>
16
+        <div class="button-group">
17
+            <button type="submit" id="btn-search">Suche</button>
18
+        </div>
19
+    </form>
20
+
21
+    <div id="output"></div>
22
+
23
+    <script src="scripts/haltestellen.js"></script>
24
+
25
+</body>
26
+
27
+</html>

+ 96
- 0
dvb-app/scripts/haltestellen.js View File

@@ -0,0 +1,96 @@
1
+/**
2
+ * Created with JetBrains WebStorm.
3
+ * User: torstenmeissner
4
+ * Date: 24.02.13
5
+ * Time: 22:38
6
+ * To change this template use File | Settings | File Templates.
7
+ */
8
+
9
+
10
+
11
+// server url
12
+var serverUrl = "http://widgets.vvo-online.de/abfahrtsmonitor/";
13
+
14
+// xmlhttp object function
15
+function getHTTPObject() {
16
+
17
+    console.log("xml http object function");
18
+
19
+    var xhr;
20
+
21
+    if(window.XMLHttpRequest) {
22
+        xhr = new XMLHttpRequest();
23
+    } else if(window.ActiveXObject) {
24
+        xhr = new ActiveXObject("Msxml2.XMLHTTP");
25
+    }
26
+
27
+    return xhr;
28
+
29
+}
30
+
31
+
32
+// ajax call function
33
+function ajaxCall(dataUrl, outputElement, callback) {
34
+
35
+    console.log("ajax function");
36
+
37
+    // get the xmlhttp object which is supported
38
+    var request = getHTTPObject();
39
+
40
+    outputElement.innerHTML = "Lade Daten ...";
41
+
42
+    request.onreadystatechange = function() {
43
+
44
+        if(request.readyState === 4 && request.status === 200) {
45
+
46
+            //save ajax response
47
+            var response = decodeHTML(request.responseText);
48
+
49
+            // check if callback is a function
50
+            if(typeof callback === "function") {
51
+                callback(response);
52
+            }
53
+        }
54
+    };
55
+
56
+    request.open("get", dataUrl, true);
57
+    request.send(null);
58
+
59
+}
60
+
61
+// wrap all in anonymous function to get out of global scope
62
+(function() {
63
+
64
+    console.log("anonymous function");
65
+
66
+    // get the search form
67
+    var searchForm = document.getElementById("search-form");
68
+
69
+    // haltestelle object
70
+    var haltestelle = {
71
+
72
+        getInfo : function(event) {
73
+
74
+            console.log("getInfo function");
75
+
76
+            // prevent submit default behaviour
77
+            event.preventDefault();
78
+
79
+            // get output area
80
+            var target  = document.getElementById("output");
81
+            var hstName = document.getElementById("q").value;
82
+            var hstUrl  = serverUrl + "Abfahrten.do?ort=dresden&hst=" + hstName;
83
+
84
+            ajaxCall(hstUrl, target, function(data) {
85
+
86
+                target.innerHTML = "";
87
+
88
+                target.innerHTML = "<p>" + data + "</p>";
89
+            });
90
+        }
91
+    };
92
+
93
+    //event listeners
94
+    searchForm.addEventListener("submit", haltestelle.getInfo, false);
95
+
96
+})();  // end of anonymous function