mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Sa 24.08.2019 18:08 Benutzername: Passwort: Auto-Login

Thema: Audio-Datei stoppt bei Auwahl einer anderen Audio-Datei nic vom 22.01.2014


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> Audio-Datei stoppt bei Auwahl einer anderen Audio-Datei nic
Autor Nachricht
forutuna
Threadersteller

Dabei seit: 22.08.2007
Ort: Barnstorf
Alter: 42
Geschlecht: Männlich
Verfasst Mi 22.01.2014 11:17
Titel

Audio-Datei stoppt bei Auwahl einer anderen Audio-Datei nic

Antworten mit Zitat Zum Seitenanfang

Grüßt euch,

Das abspielen der Audio-Dateien funktioniert eigentlich soweit. Ich habe drei Audiodateien mit HTML5 <audio id="fürjedeeineandere"> eingefügt. Wenn ich auf einen der Songs auf Play drücke wird der jeweilige Titel auch Ordnungsgemäß abgespielt. Klicke ich nun einen anderen Song, wir der auch abgepielt, jedoch wird der vorherige nicht automatisch gestoppt. Somit laufen beide gleichzweitig. Wenn ich den dritten jetzt anklicke laufen alle drei. Ich muss somit erst den anderen stoppen damit ich den nächsten ohne ein durcheinander zu haben abspielen lassen kann. Was muss ich verändern um diese Problem nicht mehr zu haben? Vielen Dank im voraus.

Code:

var activeSong;
function play(id){
    activeSong = document.getElementById(id);
    activeSong.play();
   
    var percentageOfVolume = activeSong.volume / 1;
    var percentageOfVolumeMeter = document.getElementById('volumeMeter').offsetWidth * percentageOfVolume;
   
    document.getElementById('volumeStatus').style.width = Math.round(percentageOfVolumeSlider) + "px";
}

function pause(){
    activeSong.pause();
}

function playPause(id){
    activeSong = document.getElementById(id);
    if (activeSong.paused){
         activeSong.play();
    }else{
         activeSong.pause();
    }
}

function updateTime(){
    var currentSeconds = (Math.floor(activeSong.currentTime % 60) < 10 ? '0' : '') + Math.floor(activeSong.currentTime % 60);
    var currentMinutes = Math.floor(activeSong.currentTime / 60);
    document.getElementById('songTime').innerHTML = currentMinutes + ":" + currentSeconds + ' / ' + Math.floor(activeSong.duration / 60) + ":" + (Math.floor(activeSong.duration % 60) < 10 ? '0' : '') + Math.floor(activeSong.duration % 60);

    var percentageOfSong = (activeSong.currentTime/activeSong.duration);
    var percentageOfSlider = document.getElementById('songSlider').offsetWidth * percentageOfSong;
   
    document.getElementById('trackProgress').style.width = Math.round(percentageOfSlider) + "px";
}
function volumeUpdate(number){
    activeSong.volume = number / 100;
}
function changeVolume(number, direction){
    if(activeSong.volume >= 0 && direction == "down"){
        activeSong.volume = activeSong.volume - (number / 100);
    }
    if(activeSong.volume <= 1 && direction == "up"){
        activeSong.volume = activeSong.volume + (number / 100);
    }
   
    var percentageOfVolume = activeSong.volume / 1;
    var percentageOfVolumeSlider = document.getElementById('volumeMeter').offsetWidth * percentageOfVolume;
   
    document.getElementById('volumeStatus').style.width = Math.round(percentageOfVolumeSlider) + "px";
}
function setLocation(percentage){
    activeSong.currentTime = activeSong.duration * percentage;
}
function setSongPosition(obj,e){
    var songSliderWidth = obj.offsetWidth;
    var evtobj=window.event? event : e;
    clickLocation =  evtobj.layerX - obj.offsetLeft;
   
    var percentage = (clickLocation/songSliderWidth);
    setLocation(percentage);
}
function setVolume(percentage){
    activeSong.volume =  percentage;
   
    var percentageOfVolume = activeSong.volume / 1;
    var percentageOfVolumeSlider = document.getElementById('volumeMeter').offsetWidth * percentageOfVolume;
   
    document.getElementById('volumeStatus').style.width = Math.round(percentageOfVolumeSlider) + "px";
}
function setNewVolume(obj,e){
    var volumeSliderWidth = obj.offsetWidth;
    var evtobj = window.event? event: e;
    clickLocation = evtobj.layerX - obj.offsetLeft;
   
    var percentage = (clickLocation/volumeSliderWidth);
    setVolume(percentage);
}
function stopSong(){
    activeSong.currentTime = 0;
    activeSong.pause();
}


Der HTML-Code wird aus der Datenbank gezogen. Die Drei Audios werden jeweils mit unterschiedlichen ID's angesprochen:

Code:

<div class="track <?=$row['class']?>" itemprop="track" itemscope itemtype="http://schema.org/MusicRecording">
    <meta content="<?=$row['mp3']?>" itemprop="audio">
    <audio itemscope itemtype="http://schema.org/AudioObject" id="<?=$row['class']?>" ontimeupdate="updateTime()">
    <source src="<?=$row['ogg']?>" type="audio/ogg">
    <source src="<?=$row['mp3']?>" type="audio/mpeg" itemprop="embedUrl">
    </audio>
    <div id="songPlayPause" class="play playbutton" onclick="playPause('<?=$row['class']?>')"></div>
    <div id="songTime"></div>
    <div id="songSlider" onclick="setSongPosition(this,event)"><div id="trackProgress"></div></div>
    </div>
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
qualidat

Dabei seit: 14.09.2006
Ort: Berlin
Alter: 58
Geschlecht: Männlich
Verfasst Do 23.01.2014 12:53
Titel

Antworten mit Zitat Zum Seitenanfang

Ich hab ejetzt keine Lust/Zeit deinen Code zeilenweise durchzugehen, aber wo ist das Problem? Stoppe doch einfach immer alle Songs (egal ob sie wirklich laufen oder nicht), bevor du einen startest ... Die Player-IDs solltest du über einen Zugriff auf das DOM-Control-Array (getElementByType oder so ähnlich) auffinden und zum Schweigen bringen können ...
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
DEKONSTRUKTIV

Dabei seit: 22.06.2009
Ort: bln
Alter: -
Geschlecht: -
Verfasst Do 23.01.2014 13:00
Titel

Antworten mit Zitat Zum Seitenanfang

warum sollte da irgendwas stoppen? dein javascript tut nichts dergleichen.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
 
Ähnliche Themen Audio Aufnehmen
Audio-Livestream
imovie audio importieren
audio spur eines mpgs exportieren
Audio in Webseiten zum Abspielen anbieten
[Flash] Suche Audio Player
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.