Vorhörenfunktion wie bei Thumbnails?

Hallo Leute,

wenn man Bilder hochlädt, werden diese nachher im Beitrag direkt zum Anzeigen dargestellt. Kann man das auch mit mp3 und wav Dateien machen, dass man diese direkt anhören kann?
Mit HTML5 und dem audio-Tag ist das ja wirklich eine Kleinigkeit. Leute die einen zu alten Browser haben, müssen es halt herunterladen. Für die, die einen aktuellen Browsre nutzen, fände ich diese Funktion ganz nützlich, da in meinem Forum viele mp3 und wav Dateien hochgeladen werden und man sich die immer erst herunterladen müsste.

Ist das vielleicht möglich noch zu integrieren?

Freue mich auf Kommentare und Meinungen dazu.

Danke im Voraus!

PS: Hier ist das z.B. auch so möglich. Wenn man eine Audio-Datei hochlädt, kann man sich die direkt anhören. Es reicht aber wie gesagt die HTML5-Variante und dem Audio-Tag.
http://www10.zippyshare.com/v/7667544/file.html

Meinst du?
Ich finde, dass das mit HTML5 ja echt nicht viel Aufwand ist und wenn das bei Bildern ja eh schon geht, warum nicht auch da?

Als Plugin könnte ich mir dann vorstellen, dass ein extra Player den neuen HTML5-Player ersetzt. Denn es gibt ja viele Lebewesen, die ja noch alte Browser nutzen. So könnte man es denen dann auch ermöglichen und einen, wie du schon sagtest, extra Player einbinden. Das halte ich aber auch für übertrieben. Würde es bei dem HTML5-Dingen dann belassen, da früher oder später eh jeder Browser diese Kleinigkeit kann.

Vielleicht hat ja noch jemand eine Meinung dazu. Danke für deine Antwort!

Mal eine kleine Frage. Ich habe mir das mal in mein Test-Forum hart eingecodet, bzw. man muss ja nur eine Zeile ändern. Habe das wie folgt malgemacht, um zu sehen, ob dasüberhaupt funktioniert.

Datei wcf/templates/attachments.tpl geöffnet. Zeile 40-46 sieht so aus:

<li class="box32">
	<a href="{link controller='Attachment' object=$attachment}{/link}"><span class="icon icon32 icon-paper-clip"></span></a>

	<div>
		<p><a href="{link controller='Attachment' object=$attachment}{/link}">{$attachment->filename}</a></p>
		<small>{lang}wcf.attachment.file.info{/lang}</small>
	</div>
</li>

und das habe ich abgeändert zu folgendem Code:

<li class="box32" style="float:left;margin:0 50px 20px 0;">
	<a href="{link controller='Attachment' object=$attachment}{/link}"><span class="icon icon32 icon-paper-clip"></span></a>

	<div>
		<p><audio src="{link controller='Attachment' object=$attachment}{/link}" controls><a href="{link controller='Attachment' object=$attachment}{/link}">{$attachment->filename}</a></audio></p>
		<small>{lang}wcf.attachment.file.info{/lang}</small>
	</div>
</li>

Das Ergebnis sieht dann so aus:

Das System an sich funktioniert sogar wunderbar. Nur macht er z.B. bei PDF-Dateien nun auch einen Player dahin, der natürlich dann nicht funktioniert. Wie kann ich nun mit einem Plugin genau diese Stelle ändern?
Ich wüsste, wie man mit PHP prüfen kann, ob es eine Audio-Datei ist oder nicht, also wann ein Player da sein müsste und wann nicht. Das würde ich so lösen:

$audiofiles = array('mp3', 'wav'); //Dateiendungen, die einen Player kriegen
$audiofile = 'test.mp3';
$pathinfo = pathinfo($audiofile);




if(in_array($pathinfo['extension'], $audiofiles))
{
	//Player ausgeben
	echo '<audio src="'.$audiofile.'" controls>'.$audiofile.'</audio>';
}
else
{
	//Alles bleibt wie gehabt
	echo $audiofile;
}

Ich weiß jetzt also nicht, wie das mit dem Burning Board in Verbindung bringen soll, kann mir da jemand vllt. einen Tipp geben?

Danke im Voraus!

Quote from helga

Wenn man einen Text schreibt, ist es wichtig diese selbstständig durchzulesen, um so Fehler im Text zu erkennen.

Nicht das wir uns falsch verstehen, es geht nicht darum, den Beitrag eines Users vorlesen zu lassen, sondern wenn jemand als Dateianhang eine MP3 oder WAV-Datei hochlädt, diese ggf. auch wiedergegeben werden kann, ohne sie erst herunterzuladen.
So spart man auch Traffic ein. Es wird ja immer nur ein Teil der Datei gepuffert.

Quote from SoftCreatR

Man kann mit PHP nicht zweifelsfrei feststellen, ob es sich wirklich um eine Audiodatei handelt, oder nicht. Natürlich kann man die Dateiendung dazu verwenden und auch den Mime-Typen noch hinzuziehen, aber ein gewisses Restrisiko bleibt.

Was denn für ein Risiko?
Wenn es keine MP3 ist, aber trotzdem die Endung hat, springt der Player einfach nicht an. Dann bleibt ja alles automatisch wie gehabt. Es wird ja nur dann ein Player darüber gelegt, damit es sich anhören kann, bevor man es sich downloadet.

Danke für eure Antworten!

Hi Morik,

habe das gerade mal bei mir eingebaut und das läuft auf Anhieb. Habe deine IF-Anweisung noch um einen Teil erweitert. So erkennt er bei mir nun MP3 und WAVE-Dateien. Außerdem kann ich jetzt so ganz einfach noch das Type-Attribut setzen. So sieht meine Lösung dann nun komplett aus:

IF-Anweisung:

{if $attachment->fileType == "audio/wav" || $attachment->fileType == "audio/mpeg"}

Ausgabe des Players:

<div>
	<p>
    		<a href="{link controller='Attachment' object=$attachment}{/link}">{$attachment->filename}</a><br />
    		<audio controls>
        			<source type="{$attachment->fileType}" src="{link controller='Attachment' object=$attachment}{/link}">
        			<a href="{link controller='Attachment' object=$attachment}{/link}">{$attachment->filename}</a>
    		</audio>
	</p>
	<small>{lang}wcf.attachment.file.info{/lang}</small>
</div>

Gibt es jetzt die Möglichkeit, mit einem Plugin genau diese Änderung zu bezwecken?
Wenn ja, wie mache ich das?
Gibt es da eine Anleitung oder so zu, wie ich genau diesen Teil ändere?

Würde das sehr gerne mal versuchen umzusetzen, vielleicht hat ja jemand einen Link oder ein Tutorial für mich.

Danke für deine Hilfe, ist echt klasse!

PS: Ach, du hast deine IF-Abfrage nun auch noch angepasst. Das habe ich leider zu spät gesehen, sorry.

Quote from bx19

Das habe ich mal getestet und soweit ok nur das es mit IE 10 und Aktuellen Opera niccht funktioniert. Mit aktuellen FF kein Problem.
Bild IE 10

Oh, in meinem IE11 geht es komischerweise auch nicht. So in einer leeren HTML-Datei funktioniert es. Kriegt er das mit der URL nicht hin?
Ich kommt die Meldung: Ungültige Quelle im IE11

Quote from bx19

Wo gehört den der Code nun hin

Habe ich hier erklärt: Vorhörenfunktion wie bei Thumbnails?

Mit einer MP3 geht es bei mir auch im IE11, nur bei WAV heult er rum. Komisch

Gehen bei dir denn MP3?

Quote from Morik

http://www.w3schools.com/html/html5_audio.asp

Nicht jeder Browser unterstützt jedes Format

Ach, natürlich.
Aber dann müsste er doch eigentlich den alternativen Text ausgeben, alá "Ihr Browser unterstützt das nicht", wenn ich den Text doch zwischen die Tags schreibe?!
Aber gut, da können wir nicht gegen machen. Die Browser werden das schon noch können, da bin ich mir sicher.