Jason S
Jason S

Reputation: 189656

making HTML and CSS "aware" of a JavaFX WebView environment

I am working on HTML+CSS+Javascript with a Java team using the JavaFX WebView renderer. I would also like to use the same HTML+CSS+Javascript in normal browsers, but I want a few minor differences in style, to optimize readability.

Is there something I can ask the JavaFX programmers to do, so that my HTML+CSS+Javascript can be "aware" of the difference? For example, a @media query, so that I can use a different CSS in WebView vs. in normal browsers.

Upvotes: 4

Views: 674

Answers (2)

Jason S
Jason S

Reputation: 189656

just ran across this page Communicating between javascript and javafx which says

The Java application can pass arbitrary scripts to the JavaScript engine of a WebEngine object by calling the WebEngine.executeScript() method:

webEngine.executeScript("history.back()");

So I guess I could have my Java team do something like this on initialization of each page:

 webEngine.executeScript("var javaFXApplicationID = 'ABCDE';");

and check for this in Javascript.

Upvotes: 0

fabian
fabian

Reputation: 82461

You can ask them to include some string in the userAgent property of the WebEngine:

WebEngine engine = ...;
engine.setUserAgent(engine.getUserAgent() + " JavaFX-WebView");

You can check this property from javascript (window.navigator.userAgent), e.g.:

<!DOCTYPE html>

<html>
    <head>
        <title>MyPage</title>
        <style>
            body {
                background-color: red;
            }
            body.javafx {
                background-color: yellow;
            }
        </style>
    </head>
    <body>
        <script>
            var javaFX = (window.navigator.userAgent.indexOf("JavaFX-WebView") > -1);
            document.body.innerHTML = javaFX ?
                    "Hello from JavaFX" : "Hello from Browser";
            if (javaFX)
                document.body.className = "javafx";
        </script>
    </body>
</html>

Upvotes: 1

Related Questions