0

I using WebView to show this website http://app.wlojii.com

I want to make control panel in notification bar to play/stop music.

The problem i cant find the function that play/stop the music.

I inspected the button element and tried some variants of functions unsuccessfully (play, play(), player.play()), and i used this method to call the functions:

mWebView.loadUrl("javascript: ...")

I am not so familiar with JavaScript and web, i need some help.

3 Answers 3

2

Pavel I have added a git repo with the working code https://github.com/premithk/webviewclickeventexample The problem last time was that getElementsByClassName returns an array. So i have changed the code to

mWebview.loadUrl("javascript(function({l=document.getElementsByClassName('mejs-playpause-button');
e=document.createEvent('HTMLEvents');
e.initEvent('click',true,true);
l[0].dispatchEvent(e);})()");

Any ways the code in repo works such that there is a button (native) that will act as play/pause

Sign up to request clarification or add additional context in comments.

3 Comments

wow, its really work,magic, thank you so much very appreciate your help and time!
another question, is it possible in my case to listen when i click on play button in webview and make changes in notification bar?
Yes, The idea is to inject an object to the JS part and use that as a bridge to call a function inside the native part. Have updated the git repo reflecting the change. Only thing is that before we inject the event listener we have to make sure the page is fully loaded, so it might take some time. So first thing is to add the interface mWebview.addJavascriptInterface(new JSInterface(), "jsnativebridge"); Then define the class
1

Register a Javascriptinterface or use this library. https://github.com/lzyzsd/JsBridge/blob/master/README.md The library acts as a bridge between webview and the Java part of the app

13 Comments

Thanks, but i need find the function name in JavaScript.
Are you looking for a generic solution or for this particular website?
this particular website
A quick check reveals that this website uses mediaelementjs.com. So don't think there will be a straight forward play function. All the player functionality is in app.wlojii.com/wp-content/themes/pulsetheme/assets/js/player.js. There you could see the event listener for the play button. Search for $(document).on('click.btn', '.btn-playpause, .btn-queque', function(e){
yes i saw it before, but how can i pass triggered it?
|
1

Yes, The idea is to inject an object to the JS part and use that as a bridge to call a function inside the native part. Have updated the git repo reflecting the change. Only thing is that before we inject the event listener we have to make sure the page is fully loaded, so it might take some time. So first thing is to add the interface mWebview.addJavascriptInterface(new JSInterface(), "jsnativebridge");

Then define the class

private class JSInterface { @JavascriptInterface public void playPauseClicked(String string) { Log.d("console", "" + string); } }

Then wait for page load and add the event listener like below

mWebview.setWebViewClient(new WebViewClient() {
            public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
                Toast.makeText(activity, description, Toast.LENGTH_SHORT).show();
            }
            public void onPageFinished(WebView view, String url) {
                Log.d("console", "" + "loaded");

               mWebview.loadUrl(
                        "javascript:(function() { " +
                                "var ch=document.getElementsByClassName('mejs-playpause-button');" +
                                "ch[0].addEventListener('click', function(){" +
                                "    jsnativebridge.playPauseClicked('Yes');" +
                                "});"+
                                "})()"
                );

            }
        });

You can refer the git repo, have added a working demo. Cheers

5 Comments

i done every thing you said, but not working and no log error
if possible can you post that class here?
ok i got it in my case ch[0] need to be ch[37] (another website), have you fiver account that i can contact you for help?
ah! great, don't have a fiver account, honestly hearing about fiver for the first time :)
i msg you in facebook

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.