overte/interface/resources/qml/controls/FlickableWebViewCore.qml

import QtQuick 2.7
import QtWebEngine 1.5
import QtWebChannel 1.0

import QtQuick.Controls 2.2

import "../styles-uit" as StylesUIt

Item {
    id: flick

    property alias url: _webview.url
    property alias canGoBack: _webview.canGoBack
    property alias webViewCore: _webview
    property alias webViewCoreProfile: _webview.profile

    property bool interactive: false
    property string userScriptUrl: ""
    property string urlTag: "noDownload=false";

    signal newViewRequestedCallback(var request)
    signal loadingChangedCallback(var loadRequest)
    //pressDelay: 300

    property real previousHeight: height

    //boundsBehavior: Flickable.StopAtBounds

    StylesUIt.HifiConstants {
        id: hifi
    }

//    onHeightChanged: {
//        if (height > 0) {
//            //reload page since window dimentions changed,
//            //so web engine should recalculate page render dimentions
//            reloadTimer.start()
//        }
//    }

//    ScrollBar.vertical: ScrollBar {
//        id: scrollBar
//        visible: flick.contentHeight > flick.height

//        contentItem: Rectangle {
//            opacity: 0.75
//            implicitWidth: hifi.dimensions.scrollbarHandleWidth
//            radius: height / 2
//            color: hifi.colors.tableScrollHandleDark
//        }
//    }

    function onLoadingChanged(loadRequest) {
        if (WebEngineView.LoadStartedStatus === loadRequest.status) {
//            flick.contentWidth = flick.width
//            flick.contentHeight = flick.height

            // Required to support clicking on "hifi://" links
            var url = loadRequest.url.toString();
            if (urlHandler.canHandleUrl(url)) {
                if (urlHandler.handleUrl(url)) {
                    _webview.stop();
                }
            }
            heightTimer.stop()
        }

        if (WebEngineView.LoadFailedStatus === loadRequest.status) {
            console.log(" Tablet WebEngineView failed to load url: " + loadRequest.url.toString());
            heightTimer.stop()
        }

        if (WebEngineView.LoadSucceededStatus === loadRequest.status) {
            //disable Chromium's scroll bars
//            _webview.runJavaScript("document.body.style.overflow = 'hidden';");
//            //calculate page height
//            _webview.runJavaScript("document.body.scrollHeight;", function (i_actualPageHeight) {
//                if (i_actualPageHeight !== undefined) {
//                    flick.contentHeight = i_actualPageHeight
//                } else {
//                    flick.contentHeight = flick.height;
//                }
//            })
//            previousHeight = flick.contentHeight
//            flick.contentWidth = flick.width
//            heightTimer.restart()
        }
    }

    Timer {
        id: heightTimer
        interval: 100
        repeat: true
        onTriggered: {
//            _webview.runJavaScript("document.body.scrollHeight;", function (i_actualPageHeight) {
//                if (i_actualPageHeight !== undefined) {
//                    var newheight = i_actualPageHeight
//                    if (newheight > 0 && newheight !== previousHeight) {
//                        previousHeight = newheight
//                        flick.contentHeight = previousHeight;
//                        _webview.height =  newheight < flick.height ? newheight : flick.height
//                        console.log("new height", previousHeight)
//                    }
//                }
//            })
        }
    }

    Timer {
        id: reloadTimer
        interval: 100
        repeat: false
        onTriggered: {
            //_webview.reload()
        }
    }

    WebEngineView {
        id: _webview

        anchors.fill: parent
        //height: parent.height

        profile: HFWebEngineProfile;

        // creates a global EventBridge object.
        WebEngineScript {
            id: createGlobalEventBridge
            sourceCode: eventBridgeJavaScriptToInject
            injectionPoint: WebEngineScript.DocumentCreation
            worldId: WebEngineScript.MainWorld
        }

        // detects when to raise and lower virtual keyboard
        WebEngineScript {
            id: raiseAndLowerKeyboard
            injectionPoint: WebEngineScript.Deferred
            sourceUrl: resourceDirectoryUrl + "/html/raiseAndLowerKeyboard.js"
            worldId: WebEngineScript.MainWorld
        }

        // User script.
        WebEngineScript {
            id: userScript
            sourceUrl: flick.userScriptUrl
            injectionPoint: WebEngineScript.DocumentReady  // DOM ready but page load may not be finished.
            worldId: WebEngineScript.MainWorld
        }

        userScripts: [ createGlobalEventBridge, raiseAndLowerKeyboard, userScript ]

        property string newUrl: ""

        Component.onCompleted: {
            //width = Qt.binding(function() { return flick.width; });
            webChannel.registerObject("eventBridge", eventBridge);
            webChannel.registerObject("eventBridgeWrapper", eventBridgeWrapper);
            // Ensure the JS from the web-engine makes it to our logging
            _webview.javaScriptConsoleMessage.connect(function(level, message, lineNumber, sourceID) {
                console.log("Web Entity JS message: " + sourceID + " " + lineNumber + " " +  message);
            });
            _webview.profile.httpUserAgent = "Mozilla/5.0 Chrome (HighFidelityInterface)";

        }

        onFeaturePermissionRequested: {
            grantFeaturePermission(securityOrigin, feature, true);
        }

//        onContentsSizeChanged: {
//            //flick.contentHeight = Math.max(contentsSize.height, flick.height);
//            //flick.contentWidth = flick.width
//        }
        //disable popup
        onContextMenuRequested: {
            request.accepted = true;
        }

        onNewViewRequested: {
            newViewRequestedCallback(request)
        }

        onLoadingChanged: {
            flick.onLoadingChanged(loadRequest)
            loadingChangedCallback(loadRequest)
        }
    }

    AnimatedImage {
        //anchoring doesnt works here when changing content size
        x: flick.width/2 - width/2
        y: flick.height/2 - height/2
        source: "../../icons/loader-snake-64-w.gif"
        visible: _webview.loading && /^(http.*|)$/i.test(_webview.url.toString())
        playing: visible
        z: 10000
    }

//    MouseArea {
//        anchors.fill: parent
//        onWheel: {
//            flick.flick(0, wheel.angleDelta.y*10)
//        }
//    }
}