Home > Net >  Is it possible to invoke sound from the JS file in Django's HTML template without Ajax?
Is it possible to invoke sound from the JS file in Django's HTML template without Ajax?

Time:08-13

I'm in the middle of migrating a site to Django framework. Almost all JS scripts works, except those related to sound.

I have a play/pause button for a song and some sounds invoked when the mouse is hovering over particular buttons. For just those files I received from the console:

enter image description here Of course, those files are in /static/hangman_game/ folder.

Other static files (js, css) work. Is it possible to somehow activate those functions related to playing sound/music without Ajax?

Function in Django's template html is onclick="togglePlay().

Variables and functions used in JS file:

var yes = new Audio("yes.wav");
var no = new Audio("no.wav");


var myAudio = new Audio('John Jacob Niles - The Maid Freed From The Gallows (1940).mp3');

function togglePlay() {
  if (isPlaying) {
    myAudio.pause()
  } else {
    myAudio.play();
  }
};
myAudio.onplaying = function() {
  isPlaying = true;
};
myAudio.onpause = function() {
  isPlaying = false;
};

function checkIt(num)
{
    var matched = false;

    for (i=0; i<lengthPass; i  )
    {
        if(pass.charAt(i) == letters[num])
        {
            //// alert(i); //Test
            pass1 = pass1.setCharacter(i, letters[num]);
            matched = true;
        }
    }
    if(matched == true)
    {
        yes.play();
        var element = "let"   num;
        document.getElementById(element).style.background = "#003300";
        document.getElementById(element).style.background = "#00C000";
        document.getElementById(element).style.background = "3px solid #00C000";
        document.getElementById(element).style.background = "default";

        updatePass();
    }
    else
    {
        no.play();
    }

CodePudding user response:

The problem with files not found (what was encountered in inspection and server's console) is very similar to my other question. When I migrate the site to Django, all file paths placed in the JS file have to have the server address as a root. So when I had for example in js file:

var yes = new Audio("yes.wav");
var no = new Audio("no.wav");

... all that's needed is just add http://127.0.0.1:8000/ like that:

var yes = new Audio("http://127.0.0.1:8000/static/hangman_game/yes.wav");
var no = new Audio("http://127.0.0.1:8000/static/hangman_game/no.wav");
  • Related