Tutorialcode anpassen, aber wie?

[Forumsgast]

Hallo Forum,

ich habe folgendes Tutorial ausprobiert. Es funktioniert auch alles, wie beschrieben.

Leider verstehe ich nicht wie ich

$zufall = rand(1,3); // Zufällige länge der Aktion simulieren 
sleep($zufall); // Simulieren einer langen Aktion... 

ersetzen muss um dort meine Aktionen auszuführen. Ich möchte gern Bilder laden. Bei meinen Versuchen sah es so aus, als ob das Script jedes mal neu aufgerufen wird bei jedem Ajax-Aufruf und damit hat er immer im ersten Schritt alles abgearbeitet. Was mache ich falsch?

Danke fürs Helfen
Gruß ein Gast

[Forumsgast]

Ich möchte gern Bilder laden.

Das Laden von Bildern hat mit AJAX erst mal nicht viel zu tun. (Wenn es um das reine Laden der Bilddaten durch den Client geht, und nicht ums Nachladen von irgendwelchem HTML-Code, der Bilder lediglich in Form von img-Elementen „enthält“.)

Wenn du also lediglich einen Ladebalken für die Bilder auf einer Seite mit vielen/großen Bildern haben willst, dann suche mit Stichworten wie „image preloader“ etc. - die entsprechenden Techniken existieren schon seit langem, bevor es „AJAX“ überhaupt gab.

(Und überleg dir auch, wie sinnvoll so ein Preloader und Ladebalken eigentlich ist. Wie viele Ressourcen noch zu laden sind, zeigt jeder moderne Browser dem Nutzer auf Wunsch sowieso schon in der Statuszeile an.)

[Forumsgast]

Es geht um etwa 1,4MB Bilddaten auf meiner eigenen kleinen Seite/ Spielwiese, ich würde gern diese Bilder dort vorladen und den Benutzer per Progressbar über den Fortschritt informieren. Es wäre nett wenn mir jemand sagen kann wie ich das Beispiel aus dem Tutorial anpassen muss um meine 15 Bilder vorzuladen, mehr möchte ich nicht.

Danke fürs Helfen

Edit: Es hängt auch eine DB-Abfrage dran die etwa 2sekunden dauert.

[Forumsgast]

Es geht um etwa 1,4MB Bilddaten auf meiner eigenen kleinen Seite/ Spielwiese, ich würde gern diese Bilder dort vorladen und den Benutzer per Progressbar über den Fortschritt informieren. Es wäre nett wenn mir jemand sagen kann wie ich das Beispiel aus dem Tutorial anpassen muss um meine 15 Bilder vorzuladen, mehr möchte ich nicht.

Danke fürs Helfen

Edit: Es hängt auch eine DB-Abfrage dran die etwa 2sekunden dauert.

Das Tutorial läd hier überhaupt nix vor. Das was gemacht wird ist ein Zeitfaktor und Sprungweite die Angeben wird um die Animation damit zu Simulieren.

Zb alle 3 Sekunden 10 Pixel dazu zum alten Balken.

Mehr macht diese Script nicht. Wenn du es für die Uploadzeit der Bilder verwenden willst musst du vorher berechnen wie lange noch der Upload dauert. Dieser Wert ergbit sich aus der Dateigröße und der Upload Geschwindigkeit.
Zb. 3kb pro Sekunde

Daraus kannste dann den Zeit Faktor berechnen wie lange es noch dauert bis es fertig ist. Das sind dann deine 100% im Lade balken. Nun brauchst du dann eben die Schrittweite noch. Also die Zeit die breits vergangen ist.

Das ganze hat allerdings einen kleinen schönheits fehler. Da die Upload Geschwindigkeit nicht immer konstant ist. Ändert sich auch die Zeit und diese änderungen müsstes du noch mit einbauen in dein Script.

Mfg Splasch

[Forumsgast]

Hm irgendwie habe ich das Gefühl hier diskutiert ihr warum ich mich für das Beispiel aus dem Tutorial entschieden habe. Meine Frage war doch einfach nur, wie muss ich das Beispiel anpassen wenn ich z.B. 10 Daten oder SQL-Abfragen laden möchte.

@splasch
Ich finde deinen Ansatz viel zu umständlich und kompliziert. In meinem Fall weiß ich, wie viele Aktionen ausgeführt werden sollen = ich kenne den prozentualen Fortschritt. Damit bin ich völlig zufrieden.

[Forumsgast]

Dann springt der Balken bei jeder Aktion. Das kann man sich dann auch schenken.

Meine Frage war doch einfach nur

Deine Frage ist nur, ob Dir das jemand macht. Ne eigene Leistung hast Du hier noch nicht vollbracht.

[Forumsgast]

Dann springt der Balken bei jeder Aktion. Das kann man sich dann auch schenken.

Das ist für mich ok, es ist ja eh ein Lernprojekt und keine durchgestylte Webseite für Jeden.

Deine Frage ist nur, ob Dir das jemand macht. Ne eigene Leistung hast Du hier noch nicht vollbracht.

Ganz schön krasse Einschätzung, meine Frage war: ich verstehe da etwas folgender Stelle nicht kann mir jemand ein Beispiel geben, schade wenn das bei dir so aus verschämt ankommt.

[Forumsgast]

Ich sehe hier keinen Ansatz von Dir. Das ist mein Kriterium zur Einschätzung. Nen fremden Code zu nehmen und zu sagen „muss doch gehen“ ist halt zu wenig.

[Forumsgast]

Hm vielleicht ist das in meinen bisherigen Posts nicht unmissverständlich klar geworden, ich habe an der fraglichen Stelle kleine eigene Funktionen aufgerufen aber ich habe nicht verstanden, ob das Script bei jedem Ajax-Aufruf von vorne beginnt und wie ich unterscheide wieviel schon erledigt ist. Meinen nicht funktionierenden PHP-Code kann ich posten, wenn das zur Lösung beiträgt.

[Forumsgast]

ich habe nicht verstanden, ob das Script bei jedem Ajax-Aufruf von vorne beginnt und wie ich unterscheide wieviel schon erledigt ist.

Dann hast du offenbar so gut wie überhaupt nichts von dem verstanden, was dort beschrieben ist

Der aktuelle Status wird jedes Mal vom aufgerufenen serverseitigen Script zurück gegeben. Die „Zählung“, wie weit der ganze Vorgang schon ist, findet bei dieser Vorgehensweise also serverseitig statt.

[Forumsgast]

Hier meine ajax.php, ich weiß ich bin noch Anfänger. Wenn ich das Script einzeln aufrufe liefert es einmal den String {"status":25,"message":"Ladestatus: 25%<\/b>"}, wenn es aber von der HTML-Seite aufgerufen wird bleibt der Ladebalken auf Lädt... stehen, er bekommt wohl nichts vom PHP-Script. An der Stelle versteh ich einfach nicht warum.

<?php   
    $loadHTMLStringArray = array ( 0 => "<img src='../images/star.jpg' border='0' height='0' width='0' STYLE='border: 0px; height: 0px; width: 0px; display: none; visible: collapse;'>",
                                        "<img src='../images/star_n.jpg' border='0' height='0' width='0' STYLE='border: 0px; height: 0px; width: 0px; display: none; visible: collapse;'>",
                                        "img src='../images/hud.png' border='0' height='0' width='0' STYLE='border: 0px; height: 0px; width: 0px; display: none; visible: collapse;'>",                                       
                                        "<img src='../images/off.jpg' border='0' height='0' width='0' STYLE='border: 0px; height: 0px; width: 0px; display: none; visible: collapse;'>");
    $stepsToLoad = sizeof($loadHTMLStringArray);
    
    
    if( $_GET['status'] == 0)
    {
      loadPictures( $loadHTMLStringArray[0], $stepsToLoad );
    }
    else
    {
      loadPictures( $loadHTMLStringArray[(floor( 100 / $_GET['status'] )-1 )], $stepsToLoad );
    }   

    function loadPictures( $htmlStringToLoad, $stepsToLoad )
    {
      $webDoc = new DOMDocument();
      $successfullLoaded = $webDoc->loadHTML($htmlStringToLoad);
      
      if ( $successfullLoaded )             // loadHTML returns true on success.
      {
          // Unser $php_array ist ein Array, welches nacher als JSON Objekt ausgeben wird
          // Enthält unseren Prozessfortschritt, als Prozentwert
          echo "<br>GET['status'] ".var_dump($_GET)."<br>"; // ---------------------> Debug
          $php_array['status'] = $_GET['status'] + floor( ( 100 / $stepsToLoad ) );
           
          // Bei 100% ist Schluss
          if($php_array['status']>100) {
              $php_array['status'] = 100;
          }
           
          // Eine von Nachricht an dem Benutzer aus PHP
          if($php_array['status'] != 100) {
              //$php_array['message'] = 'Lade Status <b>'.$php_array['status'].'%</b> von 100%, Differenz: '.(100-$php_array['status']);
              $php_array['message'] = 'Ladestatus: <b>'.$php_array['status'].'%</b>';
          } else {
              $php_array['message'] = 'Laden abgeschlossen';        
          }
           
          // Ausgabe des PHP Arrays als JSON Objekt
          echo json_encode($php_array);
      }
      else
      {
        echo "Error<br>";
        var_dump($php_array);
      }
    }
?>

[Forumsgast]

liefert es einmal den String {"status":25,"message":"Ladestatus: 25%<\/b>"}

Und daran fällt Dir nichts auf?

[Forumsgast]

Nein ich dachte das ist was es machen soll wenn es manuell aufgerufen wird.

[Forumsgast]

Da jedes Dokument einzeln und automatisch ausgeliefert wird, macht es ohnehin keinen Sinn, Ajax zu verwenden.

[Forumsgast]

wenn es aber von der HTML-Seite aufgerufen wird bleibt der Ladebalken auf Lädt... stehen, er bekommt wohl nichts vom PHP-Script.

Letzteres hast du wohl einfach vemutet, nicht aber in irgendeiner Weise kontrolliert?
-> Firebug nehmen, und im Netzwerk-Tab den Request anschauen!

Und wo du schon mal dort bist, auch noch gleich in die Fehlerkonsole schauen, ob die was meldet.