idle-animation

animations.js

@@ -1,6 +1,8 @@
 var stage = 0
+var a = ["..", ".", "", ".", "..", "..."]
+
 $(document).ready(function () {
-        var up = document.getElementById("upload")
+        up = document.getElementById("upload")
         if (up != null) {up.addEventListener ("click", ButtonPress)}
         var height1 = $("#eins").height ();
         var height2 = $("#zwei").height ();
@@ -13,7 +15,7 @@ $(document).ready(function () {
             else if (stage == 0 && pos+600 >= height1){ moveBlobs (1000, 1000, 1)}
             else if ((stage == 1 && pos < height1-450)) { moveBlobs (0,0,0) }
         })
-}
+    }
 )
 
 function moveBlobs (t, r, to) {
@@ -59,13 +61,14 @@ function moveBlobs (t, r, to) {
 } 
 
 function ButtonPress () {
+    up.setAttribute ('disabled', 'disabled')
     document.body.style.cursor = "progress"
     $("#upload").css ({
         'cursor': 'not-allowed',
         'animation': 'text-in-out 1s'
     })
     setTimeout (function () {
-        document.getElementById("upload").textContent = "Verarbeite..."
+        up.textContent = "Verarbeite..."
         $("#upload").css ({
             'padding-right': '140px',
             'padding-left': '139px',
@@ -78,5 +81,16 @@ function ButtonPress () {
             'animation': 'border-in-out 2s infinite'
         })
     }, 1000)
+    setTimeout (function () {
+        textLoop (0)
+    }, 200)
+    
 }
 
+function textLoop (i){
+    setTimeout (function (){
+        up.textContent = "Verarbeite" + a[i]
+        if (i<5) { textLoop (++i)}
+        else { textLoop (0)}
+    }, 2000)
+}