How to play different audio-clips for different users?

I want to play different audio-clips for test-takers of different levels on my test-taking website.
I prefer to auto-play the clip on page-load, if possible.

I see 2 ways to implement this:

  1. My audio-players are hidden to prevent students fast-forwarding or replaying. So I could put all 14 audio clips on different hidden audio players, with IDs like #audioPlayer1 & #audioPlayer2 and so on. Then, I could use $w(“#audioPlayer”+i).play() inside the page’s onReady(), to play clip number i.

  2. I could use this solution → https://www.wix.com/corvid/forum/community-discussion/playing-audio-w-html-component-doesn-t-work-on-chrome
    In case Chrome demands user interaction prior to autoplaying, I could give the user a separate “START TEST” button to click, from which I call $w(“#audioPlayer1”).play().

I have read extensively the discussions on ‘dynamic audio-playing on corvid’, but most threads are from 2018.

Please advise me on what method is the most feasible & advisable for my situation and the current state of browser policy.

Hello Bhavika Khare,

  1. Start playing when page loads…
$w.onReady(function () {start_myAudio})

function start_myAudio(){.... HERE YOUR CODE....}
  1. It would not be necessary inputting 14x on 14x hided Audioplayer.
  • you could use a REPEATER + DATABASE to solve your problem.

  • in DATABASE you store the URLs to your AudioClips

  • the REPEATER is connected to the DATABASE with a DATASET

  • you can place a BUTTON into REPEATER, which would be dynamic.

I think i can show you a similar situation, but with VideoPlayer.
In this example here, you can see a Video-Play-List loaded from a DATABASE (automatic, when page is ready) into a REPEATER (trough a DATASET).

https://russian-dima.wixsite.com/meinewebsite/blank-21

There is just one BUTTON placed in REPEATER, which dynamically change the URL with every selected video.

CONCLUSION: You can put in 14x different Audio-Player into your website and then always expand with more and more player, or you can put in just one REPEATER and store all your data in a DATABASE.

I want to play different audio-clips for test-takers of different levels on my test-taking website .

What do you mean, when you say “different-level” ???

1 Like

I’m making an abacus website, so we have level 1 students, level 2 students, etc, each giving different exams at their respective levels

1 Like

But then for a level 1 student, I only want the level 1 clip to play, and for a level 7 student, I only want the level 7 clip to play. How will I select the appropriate clip from a repeater?

Take a look at this example here, very similar to your needs.
https://russian-dima.wixsite.com/meinewebsite/repeater

How i would solve your problem?

Ok, let’s GO !

Your situation: (let’s collecting some given facts)

  • students (with several level [level1 - level7]

  • audio-files belonging to the level-states

  • database / dataset / repeater / button

your DATABASE in this case, should look like this one…

              (DATABASE-1)							            (DATABASE-2) 

Student-Name | Access-Level | USER-ID | audio-file (URL) | LEVEL


Bhavika Khare | LEVEL-7 (full) | ID = 0015 | audio-file-1 | LEVEL-5
Buy Adderall | LEVEL-5 | ID = 0019 | audio-file-2 | LEVEL-7
| audio-file-3 | LEVEL-7
| audio-file-4 | LEVEL-2
| audio-file-5 | LEVEL-3
| audio-file-6 | LEVEL-1
| audio-file-7 | LEVEL-2

Now image, that you have a table on your site which is connected trough a dataset with DATABASE-2. It shows normaly all the audio-files which are located in the DATABASE-2 (no they are not really located there, but FILE-URL stored in it).

Now Student-2 (Buy Adderall) enters the page and see the table. What can he see in the table? Yes he will see just LEVEL-5 Audio-Files, because when he entered the page, we already have asked for his PERMISSION-LEVEL with a CODE like that…

$w.onReady( () => {
  
  //getting information about the USER who enter the page.
  import wixUsers from 'wix-users';

// ...

let user = wixUsers.currentUser;

let userId = user.id;           // "r5cme-6fem-485j-djre-4844c49"
let isLoggedIn = user.loggedIn; // true

user.getEmail()
  .then( (email) => {
    let userEmail = email;      // "user@something.com"
  } );

user.getRoles()
  .then( (roles) => {
    let firstRole = roles[0];
    let roleName = firstRole.name;                // "Role Name"
    let roleDescription = firstRole.description;  // "Role Description"
  } );

user.getPricingPlans()
  .then( (pricingPlans) => {
    let firstPlan = pricingPlans[0];
    let planName = firstPlan.name;          // "Gold"
    let startDate = firstPlan.startDate;    // Wed Aug 29 2018 09:39:41 GMT-0500 (Eastern Standard Time)
    let expiryDate = firstPlan.expiryDate;  // Thu Nov 29 2018 08:39:41 GMT-0400 (Eastern Daylight Time)
  } );   
      
  //now we have all User-Data which we can work with.
  //our USER is for example ---> 0015 (Bhavika Khare)
  // Now we know that Bhavika Khare is on the page and we know
  // his LEVEL, because now we can fitler......
    
  $w("#dataset1").setFilter( wixData.filter()
  .eq("USER-ID", "0015")
);  

  //Now we have found the current USER in our DATABASE-1.
  //Let us find his permission-level......
  
    $w("#dataset1").onReady( () => {    
        $w("#dataset1").getItems(0, $w("#dataset1").getTotalCount())
 
        .then( (result) => {
           let items = result.items
           let totalCount = result.items.length
           let firstFilteredItem = items[0]
           let lastFilteredItem = items[totalCount-1]
           
            console.log(result)
            console.log(totalCount)
            console.log(firstFilteredItem)
            console.log(lastFilteredItem)
        })        
    })
  
    // Congratulation, now you know the level of the User!
    // His Level is ---> LEVEL-7
         
    // What is the next step what we want to do?                   
    // Of course we have to filter now the DATABASE2 for all items with LEVEL-7.
        
    // You do it the same way like with DATABASE-1 (set-filter & get the results and decide what to do with the filtered results).         
                                                                                      
                               
  //And our last step will be to get the current selected item 
 in the table and set by DOUBLE-CLICK the right chosen URL to the BUTTON. For this you will need no REPEATER and just 1-Button!                                
                                                  
  
  
import wixLocation from 'wix-location';

$w.onReady(() => {
    $w('#dataset2').onReady(() => {
        $w('#table1').onRowSelect(event => {
 const currentRowIndex = event.rowIndex;
 const item = $w('#dataset2').getCurrentItem();
 const itemTitle = item.title
 const URL = item.Url.toString();
 const dynamicURL = item["link-tutorials-title"];
            $w('#BTNgo').link = dynamicURL;

            console.log("Item-Title = " + itemTitle)
            console.log("Row-Index = " + currentRowIndex);
 //  console.log("URL = " + URL);
 //  console.log(dynamicURL);
 
            $w('#table1').onDblClick(() => {
                console.log("URL = " + URL);
                wixLocation.to(URL)
            })

            $w('#BTNgo').onClick(() => {
                wixLocation.to(URL)
            })
        })
    });
});
  

Now you have just to modify and optimize this example-code and to create your own CODE-VERSION of it. Cut off all that stuff which you will not need in your own code.

Good luck!

1 Like

Thank you so much for helping out! This will take a while to soak in, but it seems to make perfect sense – I understand the gist of it.

You are always welcome. :grin:
Yes it needs a little bit of time to check all this stuff.
Take your time.

The best way of learning is learning by doing. So try to do some own examples.