$(document).ready(function() {
   $("#bildunterst").append('<div class="waitstate" id="supporters_list"></div>');
   $("#supporters_list").load("/support.php", {"subject":"mindestlohn_photo", "testamonial":"true"}, function () {
      var animation = null;
      var start_animation = null;
      var speech_balloons = {};
      $(".speech_balloon_item").each (function() {
         speech_balloons[$(this).attr("id")] = $(this).css("left");
      });

      var supporter_image_activate = function(evt) {
         var item = evt.currentTarget;
         $(".supporter_image_item").each (function () {
            if ($(this).hasClass("active")) {
               $(this).removeClass("active")
            }
         });
         var cnt_index = $(item).data("cnt_index");
         $(".speech_balloon_item").each (function() {
            var offset = speech_balloons[$(this).attr("id")].replace("px", "") - (261 * cnt_index);
            $(this).animate({ left:offset }, 500);
         });
         $(item).addClass("active");
      }

      var get_item_by_index = function (ind) {
         var item = null;
         $(".supporter_image_item").each (function () {
            if ($(this).data("cnt_index") == ind)
               item = this;
         });
         return {currentTarget:item};
      }

      function animate() {
         var is_active = 0;
         $(".supporter_image_item").each (function () {
            if ($(this).hasClass("active"))
               is_active = $(this).data("cnt_index");
         });

         animation = window.setInterval(function () {
            supporter_image_activate(get_item_by_index(++is_active));
            if (($(".supporter_image_item").length-1) == is_active) {
               is_active = -1;
            }
         }, 10000);
      }

      var supporter_image_out = function () {
         start_animation = window.setTimeout(function () { animate() }, 500);
      }

      var cnt_index = 0;
      $(".supporter_image_item").each (function () {
         $(this).data("cnt_index", cnt_index++);
         $(this).hover(
            function (evt) {
               clearInterval(animation);
               clearTimeout(start_animation);
               supporter_image_activate(evt)
            }, supporter_image_out);
      })

      animate();
   });

   var has = false;
   var stulo_active = false;
   $("#stundenlohn a").click(
         function (evt) {
            if (has) {
               if (stulo_active) {
                  $("#milocalc_div").hide(250);
                  stulo_active = false;
               } else {
                  $("#milocalc_div").show(250);
                  stulo_active = true;
               }
               return false;
            }

            has = true;
            stulo_active = true;
            var html = [];
            html.push('<div id="milocalc_div">');
            html.push('<div class="richtext">');
            html.push('8,50 Euro Mindestlohn: Zu wenig, zu viel, gerade ausreichend? Was verdienen Sie pro Stunde?');
            html.push('</div>');
            html.push('<form id="milocalc">');
            html.push('<p class="message" id="milo_err" style="display:none">Bitte geben Sie in beide Felder Werte gr&ouml;&szlig;er als Null ein!</p>');
            html.push('<div><label for="milo_molo">Bruttomonatslohn in Euro</label><input type="text" id="milo_molo" class="label"/></div>');
            html.push('<div><label for="milo_was">Wochenarbeitsstunden</label><input type="text" id="milo_was"  class="label"/></div>');
            html.push('<div><input id="milocalc_btn" type="button" value="berechnen" class="wwe_form_submit" />');
            html.push('<input type="text" class="label" style="background-color:#eff1f4" readonly="readonly" id="milo_stulo" /></div>');
            html.push('<div class="clear noheight">&nbsp;</div>');
            html.push('</form>');
            html.push('</div>');

            $("#stundenlohn").append(html.join(""));
            $("#milocalc_div").show(250);
            
            $("#milocalc_btn").click(function (evt) {
               var valA = $("#milo_molo").val();
               var valB = $("#milo_was").val();
               if (valA == "" || valB == "") {
                  $("#milo_err").show();
                  return false;
               }
               var res = Math.round( valA / (valB * 13 / 3) * 100) / 100;
               $("#milo_stulo").val(res.toString().replace(".", ",") + " € Stundenlohn");
               return false;
            });

            return false;
         }

   );

});