TabletWebView redesigned to single WebView instance

This commit is contained in:
Vladyslav Stelmakhovskyi 2017-04-06 17:53:46 +02:00
parent be2fdd9388
commit 16fa7988f6
2 changed files with 154 additions and 265 deletions

View file

@ -1,5 +1,5 @@
import QtQuick 2.5
import QtQuick.Controls 1.2
import QtQuick.Controls 1.4
import QtWebChannel 1.0
import QtWebEngine 1.2
@ -7,7 +7,7 @@ import "controls"
import "styles" as HifiStyles
import "styles-uit"
import "windows"
import HFWebEngineProfile 1.0
import HFTabletWebEngineProfile 1.0
Item {
id: root
@ -27,138 +27,103 @@ Item {
x: 0
y: 0
function goBack() {
webview.goBack();
}
function goForward() {
webview.goForward();
}
function gotoPage(url) {
webview.url = url;
}
function setProfile(profile) {
webview.profile = profile;
}
function reloadPage() {
webview.reloadAndBypassCache();
webview.setActiveFocusOnPress(true);
webview.setEnabled(true);
QtObject {
id: eventBridgeWrapper
WebChannel.id: "eventBridgeWrapper"
property var eventBridge;
}
Item {
id:item
WebEngineView {
id: webview
objectName: "webEngineView"
x: 0
y: 0
width: parent.width
implicitHeight: parent.height
height: keyboardEnabled && keyboardRaised ? parent.height - keyboard.height : parent.height
QtObject {
id: eventBridgeWrapper
WebChannel.id: "eventBridgeWrapper"
property var eventBridge;
profile: HFTabletWebEngineProfile {
id: webviewTabletProfile
storageName: "qmlTabletWebEngine"
}
WebEngineView {
id: webview
objectName: "webEngineView"
x: 0
y: 0
width: parent.width
height: keyboardEnabled && keyboardRaised ? parent.height - keyboard.height : parent.height
profile: HFWebEngineProfile {
id: webviewProfile
storageName: "qmlWebEngine"
}
property string userScriptUrl: ""
property string userScriptUrl: ""
// 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: webview.userScriptUrl
injectionPoint: WebEngineScript.DocumentReady // DOM ready but page load may not be finished.
worldId: WebEngineScript.MainWorld
}
// creates a global EventBridge object.
WebEngineScript {
id: createGlobalEventBridge
sourceCode: eventBridgeJavaScriptToInject
injectionPoint: WebEngineScript.DocumentCreation
worldId: WebEngineScript.MainWorld
}
userScripts: [ createGlobalEventBridge, raiseAndLowerKeyboard, userScript ]
property string newUrl: ""
webChannel.registeredObjects: [eventBridgeWrapper]
// detects when to raise and lower virtual keyboard
WebEngineScript {
id: raiseAndLowerKeyboard
injectionPoint: WebEngineScript.Deferred
sourceUrl: resourceDirectoryUrl + "/html/raiseAndLowerKeyboard.js"
worldId: WebEngineScript.MainWorld
}
Component.onCompleted: {
// 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";
web.address = url;
}
onFeaturePermissionRequested: {
grantFeaturePermission(securityOrigin, feature, true);
}
// User script.
WebEngineScript {
id: userScript
sourceUrl: webview.userScriptUrl
injectionPoint: WebEngineScript.DocumentReady // DOM ready but page load may not be finished.
worldId: WebEngineScript.MainWorld
}
onLoadingChanged: {
keyboardRaised = false;
punctuationMode = false;
keyboard.resetShiftMode(false);
// Required to support clicking on "hifi://" links
if (WebEngineView.LoadStartedStatus == loadRequest.status) {
var url = loadRequest.url.toString();
if (urlHandler.canHandleUrl(url)) {
if (urlHandler.handleUrl(url)) {
root.stop();
}
userScripts: [ createGlobalEventBridge, raiseAndLowerKeyboard, userScript ]
property string newUrl: ""
webChannel.registeredObjects: [eventBridgeWrapper]
Component.onCompleted: {
// 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 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Mobile Safari/537.36";
web.address = url;
}
onFeaturePermissionRequested: {
grantFeaturePermission(securityOrigin, feature, true);
}
onLoadingChanged: {
keyboardRaised = false;
punctuationMode = false;
keyboard.resetShiftMode(false);
// Required to support clicking on "hifi://" links
if (WebEngineView.LoadStartedStatus == loadRequest.status) {
var url = loadRequest.url.toString();
if (urlHandler.canHandleUrl(url)) {
if (urlHandler.handleUrl(url)) {
root.stop();
}
}
}
}
onNewViewRequested: {
var component = Qt.createComponent("./TabletBrowser.qml");
if (component.status != Component.Ready) {
if (component.status == Component.Error) {
console.log("Error: " + component.errorString());
}
return;
}
var newWindow = component.createObject();
newWindow.setProfile(webview.profile);
request.openIn(newWindow.webView);
newWindow.eventBridge = web.eventBridge;
stackRoot.push(newWindow);
newWindow.webView.forceActiveFocus();
onNavigationRequested: {
if (request.navigationType == WebEngineNavigationRequest.LinkClickedNavigation) {
pagesModel.append({webUrl: request.url.toString()})
}
}
} // item
onNewViewRequested: {
request.openIn(webView);
}
}
Keys.onPressed: {
switch(event.key) {
case Qt.Key_L:
@ -171,4 +136,4 @@ Item {
}
}
} // dialog
}

View file

@ -1,6 +1,6 @@
import QtQuick 2.5
import QtQuick.Controls 1.4
import QtWebEngine 1.1
import QtWebEngine 1.2
import QtWebChannel 1.0
import "../controls-uit" as HiFiControls
import "../styles" as HifiStyles
@ -14,17 +14,20 @@ Item {
height: parent.height
property var parentStackItem: null
property int headerHeight: 38
property alias url: root.url
property string address: url
property alias scriptURL: root.userScriptUrl
property string url
property string address: url //for compatibility
property string scriptURL
property alias eventBridge: eventBridgeWrapper.eventBridge
property bool keyboardEnabled: HMD.active
property bool keyboardRaised: false
property bool punctuationMode: false
property bool isDesktop: false
property WebEngineView view: root
property WebEngineView view: loader.currentView
property int currentPage: -1 // used as a model for repeater
property alias pagesModel: pagesModel
Row {
id: buttons
HifiConstants { id: hifi }
@ -37,29 +40,29 @@ Item {
anchors.leftMargin: 8
HiFiGlyphs {
id: back;
enabled: true;
enabled: currentPage > 0
text: hifi.glyphs.backward
color: enabled ? hifistyles.colors.text : hifistyles.colors.disabledText
size: 48
MouseArea { anchors.fill: parent; onClicked: stackRoot.goBack() }
MouseArea { anchors.fill: parent; onClicked: goBack() }
}
HiFiGlyphs {
id: forward;
enabled: stackRoot.currentItem.canGoForward;
enabled: currentPage < pagesModel.count - 1
text: hifi.glyphs.forward
color: enabled ? hifistyles.colors.text : hifistyles.colors.disabledText
size: 48
MouseArea { anchors.fill: parent; onClicked: stackRoot.currentItem.goForward() }
MouseArea { anchors.fill: parent; onClicked: goForward() }
}
HiFiGlyphs {
id: reload;
enabled: true;
text: webview.loading ? hifi.glyphs.close : hifi.glyphs.reload
enabled: view != null;
text: (view !== null && view.loading) ? hifi.glyphs.close : hifi.glyphs.reload
color: enabled ? hifistyles.colors.text : hifistyles.colors.disabledText
size: 48
MouseArea { anchors.fill: parent; onClicked: stackRoot.currentItem.reloadPage(); }
MouseArea { anchors.fill: parent; onClicked: reloadPage(); }
}
}
@ -86,7 +89,7 @@ Item {
}
//root.hidePermissionsBar();
web.keyboardRaised = false;
stackRoot.currentItem.gotoPage(text);
gotoPage(text);
break;
@ -94,157 +97,78 @@ Item {
}
}
ListModel {
id: pagesModel
onCountChanged: {
currentPage = count - 1
}
}
function goBack() {
if (currentPage > 0) {
currentPage--;
}
}
function goForward() {
if (currentPage < pagesModel.count - 1) {
currentPage++;
}
}
function gotoPage(url) {
pagesModel.append({webUrl: url})
}
function reloadPage() {
view.reloadAndBypassCache()
view.setActiveFocusOnPress(true);
view.setEnabled(true);
}
onCurrentPageChanged: {
if (currentPage >= 0 && currentPage < pagesModel.count && loader.item !== null) {
loader.item.url = pagesModel.get(currentPage).webUrl
}
}
onUrlChanged: {
gotoPage(url)
}
QtObject {
id: eventBridgeWrapper
WebChannel.id: "eventBridgeWrapper"
property var eventBridge;
}
Loader {
id: loader
property WebEngineView currentView: null
StackView {
id: stackRoot
width: parent.width
height: parent.height - web.headerHeight
asynchronous: true
anchors.top: buttons.bottom
//property var goBack: currentItem.goBack();
property WebEngineView view: root
initialItem: root;
function goBack() {
if (depth > 1 ) {
if (currentItem.canGoBack) {
currentItem.goBack();
} else {
stackRoot.pop();
currentItem.webView.focus = true;
currentItem.webView.forceActiveFocus();
web.address = currentItem.webView.url;
}
} else {
if (currentItem.canGoBack) {
currentItem.goBack();
} else if (parentStackItem) {
web.parentStackItem.pop();
active: false
source: "../TabletBrowser.qml"
onStatusChanged: {
if (loader.status === Loader.Ready) {
currentView = item.webView
item.webView.userScriptUrl = web.scriptURL
if (currentPage >= 0) {
//we got something to load already
item.url = pagesModel.get(currentPage).webUrl
}
}
}
QtObject {
id: eventBridgeWrapper
WebChannel.id: "eventBridgeWrapper"
property var eventBridge;
}
WebEngineView {
id: root
objectName: "webEngineView"
x: 0
y: 0
width: parent.width
height: keyboardEnabled && keyboardRaised ? (parent.height - keyboard.height) : parent.height
profile: HFTabletWebEngineProfile {
id: webviewTabletProfile
storageName: "qmlTabletWebEngine"
}
property WebEngineView webView: root
function reloadPage() {
root.reload();
}
function gotoPage(url) {
root.url = url;
}
property string userScriptUrl: ""
// 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: root.userScriptUrl
injectionPoint: WebEngineScript.DocumentReady // DOM ready but page load may not be finished.
worldId: WebEngineScript.MainWorld
}
userScripts: [ createGlobalEventBridge, raiseAndLowerKeyboard, userScript ]
property string newUrl: ""
webChannel.registeredObjects: [eventBridgeWrapper]
Component.onCompleted: {
// Ensure the JS from the web-engine makes it to our logging
root.javaScriptConsoleMessage.connect(function(level, message, lineNumber, sourceID) {
console.log("Web Entity JS message: " + sourceID + " " + lineNumber + " " + message);
});
root.profile.httpUserAgent = "Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Mobile Safari/537.36"
}
onFeaturePermissionRequested: {
grantFeaturePermission(securityOrigin, feature, true);
}
onLoadingChanged: {
keyboardRaised = false;
punctuationMode = false;
keyboard.resetShiftMode(false);
// Required to support clicking on "hifi://" links
if (WebEngineView.LoadStartedStatus == loadRequest.status) {
var url = loadRequest.url.toString();
if (urlHandler.canHandleUrl(url)) {
if (urlHandler.handleUrl(url)) {
root.stop();
}
}
}
}
onNewViewRequested:{
var component = Qt.createComponent("../TabletBrowser.qml");
if (component.status != Component.Ready) {
if (component.status == Component.Error) {
console.log("Error: " + component.errorString());
}
return;
}
var newWindow = component.createObject();
newWindow.setProfile(root.profile);
request.openIn(newWindow.webView);
newWindow.eventBridge = web.eventBridge;
stackRoot.push(newWindow);
}
}
HiFiControls.Keyboard {
id: keyboard
raised: web.keyboardEnabled && web.keyboardRaised
numeric: web.punctuationMode
anchors {
left: parent.left
right: parent.right
bottom: parent.bottom
}
}
}
Component.onCompleted: {
web.isDesktop = (typeof desktop !== "undefined");
address = url;
loader.active = true
}
Keys.onPressed: {