Grafiklink tauschen

[Andre]

Hallo,

ich bin noch Anfänger mit Javascript. Habe hier im Forum gesucht, aber nichts gefunden was mir hilft... Also meine Frage:

Ich betreibe ein Internetradio und möchte auf der Seite im Netz neben dem Titel auch ein Pictogram des Covers anzeigen. Die Titelaktualisierung funktioniert. Leider weigert er sich beharrlich mir auch das Bild anzuzeigen. Hier der Script:

<script src="[link zum Bildverzeichnis]/piclink.js" type="text/javascript"></script>

<script type="text/javascript">
var BildDatei = SongPic;
var Link = "[verzeichnis]"+BildDatei;
var Link2 = Link;

var NA = "[Link zum Bild falls keins für Titel verfügbar]";

function change_pic( pImage, pSource ){
 document.getElementById(pImage).src = pSource;
 }

if(Link != NA ){
   change_pic('image5','Link2')
   setTimeout("change_pic('image5','Link2')", 60000)
}
</script>

In der piclink.js speichert meine Sendesoftware den Dateinamen des Bildes. Diesen lese ich mit der Variablen BildDatei aus und erzeuge dann einen kompletten Link. Im Html Dokument soll dann die ID image5 den Bildlink ersetzen. In einem anderen Html Dokument funktioniert das auch, warum hier nicht? Bilddatei ist im Verzeichnis vorhanden, wenn ich die Variablen ausgebe wird auch der Link vollständig angezeig.

Hier noch der DIV Ctr über den die Image dann geladen werden soll:

<div class="Normaler_Text" style="position: absolute; left:736px; top:293px;font-family:'Segoe Print Regular', Helvetica, Arial, sans-serif;color:#000000;">
  <span class="xr_tl Normaler_Text" style="top: -16px;font-family:'Arial', Arial;color:#FFFFFF;"><img id="image5" src="[link zum bild wenn keins da ist]/na.png"  width="40" height="40"></span>
 </div>

Der Inhalt der piclink.js ist lediglich:

var SongPic = 'muster.jpg';

Wo mache ich den Denkfehler, warum bekomme ich das Bild nicht angezeigt.

Das Ergebnis Momentan könnt Ihr sehen unter:

rg1.radiogeldern.de/radio_geldern_1.shtml

Hinter dem Titel soll dann ein Pictogramm mit dem Cover erscheinen...

Wäre dankbar für Hilfe.

Lg Andre

[misterunknown]

Moin,

vorne weg: Es gibt hier die Möglichkeit, Code entsprechend zu formatieren, welche auch genutzt werden sollte ;)

if(Link != NA ){
   change_pic('image5','Link2')
   setTimeout("change_pic('image5','Link2')", 60000)
}

Warum rufst du die Funktion change_pic() 2 mal auf? Einmal normal und einmal mit setTimeout()?

Bilddatei ist im Verzeichnis vorhanden, wenn ich die Variablen ausgebe wird auch der Link vollständig angezeig.

Dann kann es also nur an der Funktion liegen? Wird diese aufgerufen? Bau doch mal ein alert("Test"); ein, damit du weißt, wo der Fehler liegt.

rg1.radiogeldern.de/radio_geldern_1.shtml

Ich habe gerade einmal piclink.js aufgerufen. Dort steht momentan nur folgendes drin:

var SongPic ='';

Das scheint mir nicht korrekt zu sein!?

Grüße Marco

[Andre]

Moin,

vorne weg: Es gibt hier die Möglichkeit, Code entsprechend zu formatieren, welche auch genutzt werden sollte ;)

if(Link != NA ){
   change_pic('image5','Link2')
   setTimeout("change_pic('image5','Link2')", 60000)
}

Warum rufst du die Funktion change_pic() 2 mal auf? Einmal normal und einmal mit setTimeout()?

Bilddatei ist im Verzeichnis vorhanden, wenn ich die Variablen ausgebe wird auch der Link vollständig angezeig.

Dann kann es also nur an der Funktion liegen? Wird diese aufgerufen? Bau doch mal ein alert("Test"); ein, damit du weißt, wo der Fehler liegt.

rg1.radiogeldern.de/radio_geldern_1.shtml

Ich habe gerade einmal piclink.js aufgerufen. Dort steht momentan nur folgendes drin:

var SongPic ='';

Das scheint mir nicht korrekt zu sein!?

Grüße Marco

Hi,

Sorry, das ich nicht formatiert habe. Ja, piclink.js ist zur zeit leer, weil noch nicht alle Titel mit Bildern hinterlegt sind. Zum Testen ist daher piclink1.js auf dem Server in dem eine Grafikdatei steht.
Der setTimeout Aufruf soll einen automtischen refresh des Bildes bewirken. Wie gesagt, ich bin noch Anfänger, ich denke doch, das ich so bewirke das das Bild alle 60 Sekunden neu geladen wird?

[misterunknown]

Moin,

rg1.radiogeldern.de/radio_geldern_1.shtml

Diese Adresse ist momentan nicht mehr erreichbar.

Ja, piclink.js ist zur zeit leer, weil noch nicht alle Titel mit Bildern hinterlegt sind. Zum Testen ist daher piclink1.js auf dem Server in dem eine Grafikdatei steht.

Ok, dort steht ein Dateiname drin. Jetzt ist die Frage, ob die Funktionen korrekt aufgerufen werden oder nicht. Dazu könntest du in jede Funktion eine Ausgabe, beispielsweise per alert(), einfügen, die den Funktionsname ausgibt.
Die Syntax und Logik scheint auf den ersten Blick korrekt zu sein. Trotzdem lohnt sich auch ein Blick in die Javascript-Konsole.

Der setTimeout Aufruf soll einen automtischen refresh des Bildes bewirken. Wie gesagt, ich bin noch Anfänger, ich denke doch, das ich so bewirke das das Bild alle 60 Sekunden neu geladen wird?

Ja, das ergibt Sinn :)

Grüße Marco

[Andre]

Ok, das Problem mit der Grafik ist soweit gelöst. Nun noch folgendes Problem... Bei dem reload der Grafik soll die funktion eiegntlich auch die piclink.js neu einlesen und dann praktisch den Link neu generieren, da sich ja die Bilder ändern. Je nachdem was gerade gespielt wird. Wie kann ich das realisieren?
Im Prinzip müsste die ganze Funktion alle z.B. 30-60 Sekunde neu durchlaufen und auch die Variablen neu einlesen und den Link generieren...

[misterunknown]

Moin,

Im Prinzip müsste die ganze Funktion alle z.B. 30-60 Sekunde neu durchlaufen und auch die Variablen neu einlesen und den Link generieren...

Du schreibst einfach die Funktion um, die das Bild ändern soll. Diese prüft nun ob sich der Pfad zum Bild innerhalb der Zeit geändert hat, und wenn ja ändert sie das Bild.

Um die Datei immer wieder dynamisch abzurufen, sind HTTP-Requests vonnöten. AJAX ist hier das Stichwort. Eine kleine Anleitung, die dich zum Ziel führen müsste gibt es hier.

Grüße Marco