Android Troubleshooting: Audio Issue with Hybrid App

Currently, I am utilizing Monaca.mobi to develop a hybrid app. Interestingly, when I compile the app for IOS, everything runs smoothly; however, there seems to be an issue with audio playback on an android device (specifically Nexus 7). Strangely enough, in the Monaca debugger, the audio functions properly. Could this discrepancy be due to some unknown specifics about android devices, such as certain app permissions?

The sound is triggered through an angularJS function that activates upon specific button clicks. Although I am confident in the accuracy of this code, it might be helpful to provide it for reference:

function DontAsk($scope){
$scope.play = function(){
    var audio = new Audio();
        audio.src = 'sounds/DontEventAsk.mp3';
    audio.play();
}}

I appreciate any insights or guidance on this matter.

javascriptandroidangularjsaudiomonaca

Answer №1

Your previous code snippet was specifically tailored for iOS devices, causing compatibility issues with Android due to the incorrect path recognition for local audio files. The updated code below addresses this issue and has been successfully tested on both operating systems.

$scope.play= function(){
    var os = navigator.platform;
    if (os=='iPhone'){
        var url = "sounds/DontEventAsk.mp3";
    }
    else{
        var url = getPhoneGapPath() + "sounds/DontEventAsk.mp3";
    }
    var my_media = new Media(url,
        // success callback
        function() {
            console.log("playAudio():Audio Success");
        },
        // error callback
        function(err) {
            console.log("playAudio():Audio Error: "+JSON.stringify(err));
    });

    // Play audio
    my_media.play();
}

Answer №2

One key issue to consider is which browser Monaca.mobi's app utilizes internally. The default Android browser has a reputation for lacking support for modern codecs such as Audio that rely on HTML5. It may be advisable to establish a signal within the app that can trigger it to handle sound playback, rather than depending on the limitations of the browser.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

JavaScript - filter out values not included in specified list of attributes

I am seeking a technique that, when provided with a list of attributes, retains only the values associated with keys present in the list. For instance: attrs = ['a', 'b', 'c'] obj = {'a': 1, 'b': 2, &apos ...

javascriptarraysjson

Is it possible to utilize setTimeout to demonstrate the execution of a while loop visually?

I am working on a function that generates random numbers between 1 and 6 until it matches a target value of 3. I want to create a visual effect where each randomly generated number is displayed on the page, but I'm facing some challenges with delays. ...

javascript

How do I use props to enable and conceal elements like lists, buttons, and images?

Check out this unique component: <ReusedHeader H1headerGray="text here... " H2headerRed="text2 here ! " pheader="p1" getStarted="button text1" hrefab="button url 1" whatWeDo="button text ...

javascriptreactjsnext.jstailwind-css

What is the best way to display label information on a Google line chart?

line graph column graph My graph continuously calls the Controller to fetch recent data from the Database. There are two lines on the graph, and I would like to display the names of each line (column) such as red=counts of something // brown=counts of so ...

javascriptjspreact-google-charts

I am attempting to change a "+" symbol to a "-" symbol using a Bootstrap toggle feature

Click on the text to reveal more information that drops down below. I am using Bootstrap icons and attempting to show a "+" icon when the toggle is collapsed, and a "-" icon when it's open. I've been trying to use display properties, but haven&ap ...

javascripttwitter-bootstraptwitter-bootstrap-3bootstrap-4toggle

How can I dynamically bind the count value in an ng-repeat loop?

I'm working with HTML code that involves looping through layers, but the values in the columns change with each loop iteration. I have concatenated the index value to the table column, but it's not working as expected. Any suggestions? <div c ...

htmlangularjs

How can I retrieve the index of a v-for loop within a function in Vue.js HTML?

How can I splice the array from the fields in HTML Vue JS if the status is true? I also need to pass the index value to a function. Is this possible? The error I am encountering is: Uncaught ReferenceError: index is not defined at Object.success (80 ...

javascripthtmlvue.jsvue-component

What is the best way to save a PDF from within a frame using JavaScript and an HTML5 <embed> tag?

I'm looking for assistance with a script for my website that dynamically generates a PDF after the user makes selections in one of the frames. The website uses the HTML5 tag to display the PDF file. Can anyone provide guidance on a script that can: ...

javascriptioshtmlpdf

Having trouble with the babel-loader and its version compatibility, as well as not finding the babel-loader folder in the node_modules directory when

Here are the steps I've taken: I cloned the project from Github. Ran the command 'yarn' to start the project. Encountered an error after running the command 'yarn start'. Even after following the steps provided in the e ...

javascriptnode.jsreactjsnpm

Is it possible to truly halt the execution of the readline function?

Exploring a scenario with the code snippet provided below, along with an input file and the resulting output. The setTimeout function is utilized to simulate an external call like an http get request. What would be the most effective or straightforward met ...

javascriptnode.js

Looking to implement pyperclip functionality on Heroku platform

Is it feasible to utilize pyperclip on Heroku with a Selenium application in order to copy something to the clipboard? Since the platform utilizes a 'headless' browser and lacks a GUI, accessing the clipboard is challenging. Is there any way for ...

javascriptpythonseleniumherokupyperclip

Error: JavaScript alert box malfunctioning

I am facing an issue with my JavaScript code. I have successfully implemented all the functionalities and can change the color of an image background. However, I am struggling to prompt a pop-up message when clicking on an image using "onclick". I have tri ...

javascripthtml

Encountered issue #98123: Failed to generate development JavaScript bundle during `gatsby develop` using Webpack

To set up a new Gatsby starter blog, I executed the following commands: gatsby new blog https://github.com/alxshelepenok/gatsby-starter-lumen cd blog gatsby develop However, while running gatsby develop, I encountered numerous errors labeled as ERROR # ...

javascriptnode.jsnpmwebpackgatsby

How can I adjust the width of a handle/thumb for NoUiSlider?

Looking to adjust the width of a NoUiSlider using CSS: .noUi-horizontal .noUi-handle { width:8px; height:25px; left: 0px; top: -8px; border: 0px solid #000000; border-radius: 0px; background: #000; cursor: default; box- ...

javascriptcssnouislider

Identify Pressed Shift Key Direction - Leveraging JQuery

I am currently working on a web application that requires users to enter capital letters. However, I want to restrict them from using the right shift key for certain keys like a, s, d, f and the left shift key for h, j, k, l in order to detect whether they ...

javascriptjqueryhtml

Analyzing the HTTP status codes of various websites

This particular element is designed to fetch and display the HTTP status code for various websites using data from a file called data.json. Currently, all sites are shown as "Live" even though the second site does not exist and should ideally display statu ...

javascriptvue.jsvuejs2

Encountering a NULL POINTER EXCEPTION with an array adapter in a listview on an Android device

When passing data from a second main view to a first main view in Android using startActivityforResult(), I encountered an issue with displaying the data on a listview. Despite successfully receiving the string back, I kept getting a nullpointer exception. ...

javaandroidarrayslistviewnullpointerexception

Step-by-step guide on displaying a tag image in HTML using html2canvas

html2canvas($('#header'), { allowTaint: true, onrendered: function (canvas) { var imgData = canvas.toDataURL("image/png"); console.log(imgData); } }); click here for an example ...

javascriptjqueryhtmlhtml2canvas

Preventing a user from navigating away from a page without completing a specific action, such as clicking a submit button

I am in the process of developing an interactive quiz platform. The quiz includes a timer that begins counting down once the user initiates the quiz. Upon completing the quiz, the user is expected to submit their answers. If the user runs out of time, th ...

phpjavascriptjqueryajax

Need help addressing a sliding page issue in my Upwork clone script using JavaScript

For those familiar with Upwork's UI, you may have noticed a small feature I implemented. When a user clicks on a freelance job offer, another page opens from the left side using transform: translate(120%) to transform: translate(0). The issue arises ...

javascripthtmlcss