Frug / AJAX-Chat

A fully customizable web chat implemented in JavaScript, PHP and MySQL which integrates nicely with common forum systems like phpBB, MyBB, FluxBB, SMF and vBulletin. A Flash and Ruby based socket connection can be used to boost performance.
http://frug.github.io/AJAX-Chat/
545 stars 301 forks source link

Chat sounds dont play #263

Open ErhabE78 opened 6 years ago

ErhabE78 commented 6 years ago

Hello I ve installed the latest version of the chat everithing is ok but when i connect the sounds dont play anymore.Not when someone connect and when i write in chat. Have someone same issue?

TCT101 commented 6 years ago

It is because the AJAX Chat sounds use Adobe Flash Player. Your Adobe Flash Player could be disabled in your web browser. Also a note, Adobe Flash Player will be gone in the year 2020, and web browsers like Mozilla Firefox & Google Chrome will take steps in the future to remove Adobe Flash Player completely from their computer programs. That being said, a new AJAX Chat version should be really be released from the developers that include chat sounds that use the newer HTML5 technology, instead of Adobe Flash Player technology. Believe me, I tried enabling Adobe Flash Player on my AJAX Chat on Google Chrome, and it still did not work, Google Chrome was still blocking Adobe Flash Player, regardless. This is why the AJAX Chat sounds should really be switched over to the newer HTML5 technology in a newer version of AJAX Chat, and I do hope that the AJAX Chat developers do see your GitHub Issue thread, to take this into consideration...

Jugolo commented 6 years ago

I dont think wee would see that in this year maby last in the nxt year??

Maby i would se if i can change it to make it to html5 but long time i has working width audio in html5 and also in the JavaScript code base :/

scottismyname commented 6 years ago

It was actually pretty simple to fix the chat sounds in the Javascript by using html5 audio instead. If people are interested, I can show you how to fix it. I didn't remove any of the adobe code from the js or from the html itself, so that would be more efficient, but it works :/

marc60 commented 6 years ago

@skaforey

thank you very much for your offer. It would be really great when you can show me how to fix it. It doesnt has to be perfect. I am happy with any solution.

Thank you very much. marc

scottismyname commented 6 years ago

Here are the steps I took...you'll need to modify js/chat.js

1) Inside the loadFlashInterface function: Remove all of the code. I left the function there because I was lazy and didn't see if anything could possibly call this.

2) Inside the flashInterfaceLoadCompleteHandler function: Remove the call to ajaxChat.initializeFlashInterface();

3) Inside the initializeFlashInterface function: Remove the call to this.initializeCustomFlashInterface();

4) Inside the playSound function, add the following 2 lines to the top of the function var audio = new Audio('sounds/'+soundID+'.mp3'); audio.play();

5) Inside the playSoundOnNewMessage function, in the large if statement on the 2nd line of the procedure, remove the check for "this.sounds". The line should now look like this: if(this.settings['audio'] && this.lastID && !this.channelSwitch) {

marc60 commented 6 years ago

@skaforey

thank you very much for your quick reply, your time to write me and your effort to fix this. I have done everything you said and it works like a charm :)

very nice :)

zwiebus commented 6 years ago

it works fine for me too. i remove only the code in loadFlashInterface: function and the complete flashInterfaceLoadCompleteHandler function. many thanks for this easy fix ;)

NiTeWuRX commented 6 years ago

Thank you SO MUCH @skaforey Ever since these changes happened, it's killed my chat, cause nobody ever knows when someone is saying anything! I hoped it would be an easy fix, and it was!

zwiebus commented 6 years ago

unfortunely we couldn't change volume after the fix .

here is my solution with a slider

in chat.js remove setAudioVolume and loadSounds function

complete the fix in playSounds

    playSound: function(soundID) {
        var audio = new Audio('sounds/'+soundID+'.mp3');
         audio.play();
            var volumeRange = document.getElementById('slider');
             audio.volume = volumeRange.value;
            if(this.sounds && this.sounds[soundID]) {
                    try {
                            // play() parameters are
                            // startTime:Number (default = 0),
                            // loops:int (default = 0) and
                            // audio.volume  (default = 60%)
                            return this.sounds[soundID].play(0, 0, this.audio.volume);
                    } catch(e) {
                            //alert(e);
                    }
            }
            return null;
    },

in loggedIn.html

add a range slider and fix/hide optionValue

behind this

<dl>
  <dt><label for="persistFontColorSetting">[LANG]settingsPersistFontColor[/LANG]</label></dt>
      <dd><input type="checkbox" id="persistFontColorSetting"onclick="ajaxChat.setPersistFontColor(this.checked);"/></dd>
                 </dl>

add and replace

            <dt><label for="audioVolumeSetting">[LANG]settingsAudioVolume[/LANG]</label></dt>
             <dd><input type="range" min="0.1" max="1" step="0.01" value="0.6" class="slider" id="slider" onchange="ChangeVolume();"/>
             </dd>
          </dl>
            <dl style="display:none;">
              <dt><label for="audioVolumeSetting">[LANG]settingsAudioVolume[/LANG]</label></dt>
                 <dd>
                     <select class="left" id="audioVolumeSetting" onchange="ajaxChat.ChangeVolume(this.options[this.selectedIndex].value);">
                       <option id="slider" value="0.6">60 %</option>
                     </select>
                   </dd>
                 </dl>

for older versions use

                                        <tr class="rowOdd">
                                                <td><label for="audioVolumeSetting">[LANG]settingsAudioVolume[/LANG]</label></td>
                                                <td class="setting">
                                        <input type="range" min="0.1" max="1" step="0.01" value="0.6" class="slider" id="slider" onchange="ChangeVolume();"/>
                                                </td>
                                        </tr>
                                     <tr class="rowOdd" style="display:none;">
                                                <td><label for="audioVolumeSetting">[LANG]settingsAudioVolume[/LANG]</label></td>
                                                  <td class="setting">
                                                <select class="volume" id="audioVolumeSetting" onchange="ChangeVolume(this.options[this.selectedIndex].value);">
                                                                 <option id="slider" value="0.6">60 %</option>
                                                  </select>
                                                 </td>
                                         </tr>

change the option value for default setting of volume as you like

scottismyname commented 6 years ago

I must have missed something, but I didn't notice that changing the volume at all. Also it causes an error. You say to remove the function, but then in the code, you're saying to add this:

onchange="setVolume();"/>

zwiebus commented 6 years ago

i update the codes with label and fix ( theres no such file .... .mp3) apache error

@skaforey . excuse there i had been rash a little bit everything should work now.

scottismyname commented 6 years ago

This fixed the volume for me.....the only issue now is that the default of 0.6 gets applied everytime. Ideally it would be a setting that gets saved/applied every session.

NiTeWuRX commented 6 years ago

Just wanted to thank you again skaforey & zwiebus I loved having the sounds back, but it was driving me nuts how loud they were Implemented the secondary changes and it added the slider and moved my default vol down! And thanks for including the 'old' version for loggedIn

zwiebus commented 6 years ago

additional changes (get setAudioVolume back and fix some minor browser errors)

chat.js row ~ 43 replace

soundTransform: null, with volumeRange: null,

row ~ 574 (behind socketUpdate: function)

setAudioVolume: function(volume) {
        var volumeRange = document.getElementById('slider');
        volume = volumeRange.value;
        if (!isNaN(volume)) {
                if (volume < 0) {
                        volume = 0.0;
                } else if (volume > 1) {
                        volume = 1.0;
                }
                this.settings['audioVolume'] = volume;
                try {
                        if (!this.volumeRange) {
                                this.volumeRange = volumeRange.value('slider');
                        }
                        this.volumeRange.setVolume(volume);
                } catch (e) {
                     //alert(e);
                }
        }
},

loggedIn.html

replace

<input type="range" min="0.0" max="1" step="0.01" value="0.6" class="slider" id="slider" onchange="ajaxChat.setAudioVolume()"/>

<select id="audioVolumeSetting" onchange="ajaxChat.setAudioVolume(this.options[this.selectedIndex].value);">

wintstar commented 6 months ago

look hier and update to html5audio

https://github.com/Frug/AJAX-Chat/commit/04bda5d8566480217978a1c8388d72e1db3e0fa6