ersetze den Ladebalken durch jQuery-Mobile-Loader

2 files changed, 10 insertions, 13 deletions

diff --git a/index.html b/index.html
index e7682b1..0ddf157 100644
--- a/index.html
+++ b/index.html
@@ -38,7 +38,7 @@
                         <input type="text" id="username" hint="Benutzername" autofocus required>
                         <label for="password">Passwort</label>
                         <input type="password" id="password" hint="Passwort" required>
-                        <button type="submit" onclick="location.href='#loading'">Einloggen</button>
+                        <button type="submit">Einloggen</button>
                     </form>
                 </div>
             </div>
@@ -48,10 +48,6 @@
                     <h1>WvS VPlan | Login - Lade...</h1>
                 </div>
                 <div role="main" class="ui-content">
-                    Laden... <span class="progress-view" id="load-progress-view">0%</span>
-                    <div class="loader">
-                        <div class="progress" id="load-progress"></div>
-                    </div>
                 </div>
             </div>
         </div>
diff --git a/js/index.js b/js/index.js
index 3c4c4d8..66b6d4e 100644
--- a/js/index.js
+++ b/js/index.js
@@ -21,11 +21,8 @@ function get_overview(){
 
     req.onreadystatechange = function(){
         if(req.readyState == 4){
-            if(req.status == 200 || window.location.href.indexOh("http") != -1){
+            if(req.status == 200 || window.location.href.indexOf("http") != -1){
                 console.log('Übersichts-Request erfolgreich');
-                $(".progress").css("max-width","40%");
-                $(".progress-view").text("40%");
-                document.getElementById('viewFlipBox').toggle();
                 return 1;
             }else{
                 console.log('Etwas ist schiefgelaufen :(');
@@ -39,10 +36,16 @@ function get_overview(){
 }
 
 function login(){
+    $.mobile.loading("show", {
+        text: "Lade... 0%",
+        textVisible: true,
+        theme: "b",
+    });
+
     var req = new XMLHttpRequest();
 
-    var username = encodeURIComponent(document.getElementById('username').value);
-    var password = encodeURIComponent(document.getElementById('password').value);
+    var username = encodeURIComponent($("#username").value);
+    var password = encodeURIComponent($("#password").value);
     var params = "username=" + username + "&password=" + password;
 
     req.onreadystatechange = function(){
@@ -55,8 +58,6 @@ function login(){
                 return;
             }else{
                 console.log('Login-Request erfolgreich');
-                document.getElementById("load-progress").style.maxWidth = "20%"; // TODO geht nicht
-                document.getElementById("load-progress-view").text = "20%";
                 get_overview();
             }
         }