Mirrors/overte
3
0
Fork 0
mirror of https://github.com/overte-org/overte.git synced 2025-04-20 11:45:36 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge branch 'master' of https://github.com/highfidelity/hifi into asynchronous-commerce

Browse source
This commit is contained in:
howard-stearns 2017-08-11 15:53:53 -07:00
commit d7f83a2fdf
4 changed files with 423 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

126
interface/resources/qml/hifi/commerce/Checkout.qml
View file

@ -26,11 +26,27 @@ Rectangle {
id: checkoutRoot;
property string itemId;
property string itemHref;
property int balanceAfterPurchase: commerce.balance() - parseInt(itemPriceText.text, 10);
property bool alreadyOwned: checkAlreadyOwned(itemId);
// Style
color: hifi.colors.baseGray;
Hifi.QmlCommerce {
id: commerce;
onBuyResult: {
/*
if (buyFailed) {
sendToScript({method: 'checkout_cancelClicked', params: itemId});
} else {
var success = commerce.buy(itemId, parseInt(itemPriceText.text));
sendToScript({method: 'checkout_buyClicked', success: success, itemId: itemId, itemHref: itemHref});
if (success) {
if (urlHandler.canHandleUrl(itemHref)) {
urlHandler.handleUrl(itemHref);
}
}
}
*/
if (failureMessage.length) {
console.log('buy failed', failureMessage);
//fixme sendToScript({method: 'checkout_cancelClicked', params: itemId});
@ -184,11 +200,56 @@ Rectangle {
}
}
// HFC Balance text
Item {
id: hfcBalanceContainer;
// Anchors
anchors.top: itemAuthorContainer.bottom;
anchors.topMargin: 16;
anchors.left: parent.left;
anchors.leftMargin: 16;
anchors.right: parent.right;
anchors.rightMargin: 16;
height: childrenRect.height;
RalewaySemiBold {
id: hfcBalanceTextLabel;
text: "HFC Balance:";
// Anchors
anchors.top: parent.top;
anchors.left: parent.left;
width: paintedWidth;
// Text size
size: 20;
// Style
color: hifi.colors.lightGrayText;
// Alignment
horizontalAlignment: Text.AlignHLeft;
verticalAlignment: Text.AlignVCenter;
}
RalewayRegular {
id: hfcBalanceText;
text: commerce.balance();
// Text size
size: hfcBalanceTextLabel.size;
// Anchors
anchors.top: parent.top;
anchors.left: hfcBalanceTextLabel.right;
anchors.leftMargin: 16;
width: paintedWidth;
// Style
color: hifi.colors.lightGrayText;
// Alignment
horizontalAlignment: Text.AlignHLeft;
verticalAlignment: Text.AlignVCenter;
}
}
// Item Price text
Item {
id: itemPriceContainer;
// Anchors
anchors.top: itemAuthorContainer.bottom;
anchors.top: hfcBalanceContainer.bottom;
anchors.topMargin: 4;
anchors.left: parent.left;
anchors.leftMargin: 16;
@ -227,6 +288,51 @@ Rectangle {
verticalAlignment: Text.AlignVCenter;
}
}
// HFC "Balance After Purchase" text
Item {
id: hfcBalanceAfterPurchaseContainer;
// Anchors
anchors.top: itemPriceContainer.bottom;
anchors.topMargin: 4;
anchors.left: parent.left;
anchors.leftMargin: 16;
anchors.right: parent.right;
anchors.rightMargin: 16;
height: childrenRect.height;
RalewaySemiBold {
id: hfcBalanceAfterPurchaseTextLabel;
text: "HFC Balance After Purchase:";
// Anchors
anchors.top: parent.top;
anchors.left: parent.left;
width: paintedWidth;
// Text size
size: 20;
// Style
color: hifi.colors.lightGrayText;
// Alignment
horizontalAlignment: Text.AlignHLeft;
verticalAlignment: Text.AlignVCenter;
}
RalewayRegular {
id: hfcBalanceAfterPurchaseText;
text: balanceAfterPurchase;
// Text size
size: hfcBalanceAfterPurchaseTextLabel.size;
// Anchors
anchors.top: parent.top;
anchors.left: hfcBalanceAfterPurchaseTextLabel.right;
anchors.leftMargin: 16;
width: paintedWidth;
// Style
color: (balanceAfterPurchase >= 0) ? hifi.colors.lightGrayText : hifi.colors.redHighlight;
// Alignment
horizontalAlignment: Text.AlignHLeft;
verticalAlignment: Text.AlignVCenter;
}
}
}
//
// ITEM DESCRIPTION END
@ -243,7 +349,8 @@ Rectangle {
height: 40;
// Anchors
anchors.left: parent.left;
anchors.top: itemDescriptionContainer.bottom;
anchors.bottom: parent.bottom;
anchors.bottomMargin: 8;
// "Cancel" button
HifiControlsUit.Button {
@ -267,6 +374,7 @@ Rectangle {
HifiControlsUit.Button {
property bool buyFailed: false; // fixme
id: buyButton;
enabled: balanceAfterPurchase >= 0 && !alreadyOwned;
color: hifi.buttons.black;
colorScheme: hifi.colorSchemes.dark;
anchors.top: parent.top;
@ -276,9 +384,8 @@ Rectangle {
anchors.right: parent.right;
anchors.rightMargin: 20;
width: parent.width/2 - anchors.rightMargin*2;
text: "Buy"
text: alreadyOwned ? "Already Owned" : "Buy";
onClicked: {
// fixme do spinner thing
commerce.buy(itemId, parseInt(itemPriceText.text));
}
}
@ -290,6 +397,16 @@ Rectangle {
//
// FUNCTION DEFINITIONS START
//
function checkAlreadyOwned(idToCheck) {
var inventory = commerce.inventory();
if (inventory.indexOf(idToCheck) !== -1) {
return true;
} else {
return false;
}
}
//
// Function Name: fromScript()
//
@ -311,7 +428,6 @@ Rectangle {
itemAuthorText.text = message.params.itemAuthor;
itemPriceText.text = message.params.itemPrice;
itemHref = message.params.itemHref;
buyButton.text = "Buy";
buyButton.buyFailed = false;
break;
case 'buyFailed':

260
interface/resources/qml/hifi/commerce/Inventory.qml Normal file
View file

@ -0,0 +1,260 @@
//
// Inventory.qml
// qml/hifi/commerce
//
// Inventory
//
// Created by Zach Fox on 2017-08-10
// Copyright 2017 High Fidelity, Inc.
//
// Distributed under the Apache License, Version 2.0.
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
//
import Hifi 1.0 as Hifi
import QtQuick 2.5
import QtQuick.Controls 1.4
import "../../styles-uit"
import "../../controls-uit" as HifiControlsUit
import "../../controls" as HifiControls
// references XXX from root context
Rectangle {
HifiConstants { id: hifi; }
id: inventoryRoot;
property string referrerURL: "";
// Style
color: hifi.colors.baseGray;
Hifi.QmlCommerce {
id: commerce;
}
//
// TITLE BAR START
//
Item {
id: titleBarContainer;
// Size
width: inventoryRoot.width;
height: 50;
// Anchors
anchors.left: parent.left;
anchors.top: parent.top;
// Title Bar text
RalewaySemiBold {
id: titleBarText;
text: "Inventory";
// Text size
size: hifi.fontSizes.overlayTitle;
// Anchors
anchors.fill: parent;
anchors.leftMargin: 16;
// Style
color: hifi.colors.lightGrayText;
// Alignment
horizontalAlignment: Text.AlignHLeft;
verticalAlignment: Text.AlignVCenter;
}
// Separator
HifiControlsUit.Separator {
anchors.left: parent.left;
anchors.right: parent.right;
anchors.bottom: parent.bottom;
}
}
//
// TITLE BAR END
//
//
// HFC BALANCE START
//
Item {
id: hfcBalanceContainer;
// Size
width: inventoryRoot.width;
height: childrenRect.height + 20;
// Anchors
anchors.left: parent.left;
anchors.leftMargin: 16;
anchors.top: titleBarContainer.bottom;
anchors.topMargin: 4;
RalewaySemiBold {
id: hfcBalanceTextLabel;
text: "HFC Balance:";
// Anchors
anchors.top: parent.top;
anchors.left: parent.left;
width: paintedWidth;
// Text size
size: 20;
// Style
color: hifi.colors.lightGrayText;
// Alignment
horizontalAlignment: Text.AlignHLeft;
verticalAlignment: Text.AlignVCenter;
}
RalewayRegular {
id: hfcBalanceText;
text: commerce.balance();
// Text size
size: hfcBalanceTextLabel.size;
// Anchors
anchors.top: parent.top;
anchors.left: hfcBalanceTextLabel.right;
anchors.leftMargin: 16;
width: paintedWidth;
// Style
color: hifi.colors.lightGrayText;
// Alignment
horizontalAlignment: Text.AlignHLeft;
verticalAlignment: Text.AlignVCenter;
}
}
//
// HFC BALANCE END
//
//
// INVENTORY CONTENTS START
//
Item {
id: inventoryContentsContainer;
// Anchors
anchors.left: parent.left;
anchors.leftMargin: 16;
anchors.right: parent.right;
anchors.rightMargin: 16;
anchors.top: hfcBalanceContainer.bottom;
anchors.topMargin: 8;
anchors.bottom: actionButtonsContainer.top;
anchors.bottomMargin: 8;
RalewaySemiBold {
id: inventoryContentsLabel;
text: "Inventory:";
// Anchors
anchors.top: parent.top;
anchors.left: parent.left;
width: paintedWidth;
// Text size
size: 24;
// Style
color: hifi.colors.lightGrayText;
// Alignment
horizontalAlignment: Text.AlignHLeft;
verticalAlignment: Text.AlignVCenter;
}
ListView {
id: inventoryContentsList;
// Anchors
anchors.top: inventoryContentsLabel.bottom;
anchors.topMargin: 8;
anchors.left: parent.left;
anchors.bottom: parent.bottom;
width: parent.width;
model: commerce.inventory();
delegate: Item {
width: parent.width;
height: 30;
RalewayRegular {
id: thisItemId;
// Text size
size: 20;
// Style
color: hifi.colors.blueAccent;
text: modelData;
// Alignment
horizontalAlignment: Text.AlignHLeft;
}
MouseArea {
anchors.fill: parent;
hoverEnabled: enabled;
onClicked: {
sendToScript({method: 'inventory_itemClicked', itemId: thisItemId.text});
}
onEntered: {
thisItemId.color = hifi.colors.blueHighlight;
}
onExited: {
thisItemId.color = hifi.colors.blueAccent;
}
}
}
}
}
//
// INVENTORY CONTENTS END
//
//
// ACTION BUTTONS START
//
Item {
id: actionButtonsContainer;
// Size
width: inventoryRoot.width;
height: 40;
// Anchors
anchors.left: parent.left;
anchors.bottom: parent.bottom;
anchors.bottomMargin: 8;
// "Back" button
HifiControlsUit.Button {
id: backButton;
color: hifi.buttons.black;
colorScheme: hifi.colorSchemes.dark;
anchors.top: parent.top;
anchors.topMargin: 3;
anchors.bottom: parent.bottom;
anchors.bottomMargin: 3;
anchors.left: parent.left;
anchors.leftMargin: 20;
width: parent.width/2 - anchors.leftMargin*2;
text: "Back"
onClicked: {
sendToScript({method: 'inventory_backClicked', referrerURL: referrerURL});
}
}
}
//
// ACTION BUTTONS END
//
//
// FUNCTION DEFINITIONS START
//
//
// Function Name: fromScript()
//
// Relevant Variables:
// None
//
// Arguments:
// message: The message sent from the JavaScript, in this case the Marketplaces JavaScript.
// Messages are in format "{method, params}", like json-rpc.
//
// Description:
// Called when a message is received from a script.
//
function fromScript(message) {
switch (message.method) {
case 'updateInventory':
referrerURL = message.referrerURL;
break;
default:
console.log('Unrecognized message from marketplaces.js:', JSON.stringify(message));
}
}
signal sendToScript(var message);
//
// FUNCTION DEFINITIONS END
//
}

25
scripts/system/html/js/marketplacesInject.js
View file

@ -89,13 +89,32 @@
});
}
function addInventoryButton() {
// Why isn't this an id?! This really shouldn't be a class on the website, but it is.
var navbarBrandElement = document.getElementsByClassName('navbar-brand')[0];
var inventoryElement = document.createElement('a');
inventoryElement.classList.add("btn");
inventoryElement.classList.add("btn-default");
inventoryElement.id = "inventoryButton";
inventoryElement.setAttribute('href', "#");
inventoryElement.innerHTML = "INVENTORY";
inventoryElement.style = "height:100%;margin-top:0;padding:15px 15px;";
navbarBrandElement.parentNode.insertAdjacentElement('beforeend', inventoryElement);
$('#inventoryButton').on('click', function () {
EventBridge.emitWebEvent(JSON.stringify({
type: "INVENTORY",
referrerURL: window.location.href
}));
});
}
function buyButtonClicked(id, name, author, price, href) {
EventBridge.emitWebEvent(JSON.stringify({
type: "CHECKOUT",
itemId: id,
itemName: name,
itemAuthor: author,
itemPrice: price,
itemPrice: Math.round(Math.random() * 50),
itemHref: href
}));
}
@ -132,7 +151,8 @@
// Try this here in case it works (it will if the user just pressed the "back" button,
// since that doesn't trigger another AJAX request.
injectBuyButtonOnMainPage();
injectBuyButtonOnMainPage;
addInventoryButton();
}
}
@ -148,6 +168,7 @@
10,
href);
});
addInventoryButton();
}
}

25
scripts/system/marketplaces/marketplaces.js
View file

@ -20,6 +20,7 @@
var MARKETPLACES_URL = Script.resolvePath("../html/marketplaces.html");
var MARKETPLACES_INJECT_SCRIPT_URL = Script.resolvePath("../html/js/marketplacesInject.js");
var MARKETPLACE_CHECKOUT_QML_PATH = Script.resourcesPath() + "qml/hifi/commerce/Checkout.qml";
var MARKETPLACE_INVENTORY_QML_PATH = Script.resourcesPath() + "qml/hifi/commerce/Inventory.qml";
var HOME_BUTTON_TEXTURE = "http://hifi-content.s3.amazonaws.com/alan/dev/tablet-with-home-button.fbx/tablet-with-home-button.fbm/button-root.png";
// var HOME_BUTTON_TEXTURE = Script.resourcesPath() + "meshes/tablet-with-home-button.fbx/tablet-with-home-button.fbm/button-root.png";
@ -86,7 +87,7 @@
function onScreenChanged(type, url) {
onMarketplaceScreen = type === "Web" && url === MARKETPLACE_URL_INITIAL;
wireEventBridge(type === "QML" && url === MARKETPLACE_CHECKOUT_QML_PATH);
wireEventBridge(type === "QML" && (url === MARKETPLACE_CHECKOUT_QML_PATH || url === MARKETPLACE_INVENTORY_QML_PATH));
// for toolbar mode: change button to active when window is first openend, false otherwise.
marketplaceButton.editProperties({ isActive: onMarketplaceScreen });
if (type === "Web" && url.indexOf(MARKETPLACE_URL) !== -1) {
@ -139,6 +140,12 @@
action: "inspectionModeSetting",
data: Settings.getValue("inspectionMode", false)
}));
} else if (parsedJsonMessage.type === "INVENTORY") {
tablet.pushOntoStack(MARKETPLACE_INVENTORY_QML_PATH);
tablet.sendToQml({
method: 'updateInventory',
referrerURL: parsedJsonMessage.referrerURL
});
}
}
}
@ -199,17 +206,23 @@
break;
case 'checkout_buyClicked':
if (message.success === true) {
tablet.gotoWebScreen(message.itemHref);
Script.setTimeout(function () {
tablet.gotoWebScreen(MARKETPLACE_URL + '/items/' + message.itemId, MARKETPLACES_INJECT_SCRIPT_URL);
}, 100);
tablet.gotoWebScreen(MARKETPLACE_URL + '/items/' + message.itemId, MARKETPLACES_INJECT_SCRIPT_URL);
} else {
tablet.sendToQml({ method: 'buyFailed' });
}
//tablet.popFromStack();
break;
case 'inventory_itemClicked':
var itemId = message.itemId;
if (itemId && itemId !== "") {
tablet.gotoWebScreen(MARKETPLACE_URL + '/items/' + itemId, MARKETPLACES_INJECT_SCRIPT_URL);
}
break;
case 'inventory_backClicked':
tablet.gotoWebScreen(message.referrerURL, MARKETPLACES_INJECT_SCRIPT_URL);
break;
default:
print('Unrecognized message from Checkout.qml: ' + JSON.stringify(message));
print('Unrecognized message from Checkout.qml or Inventory.qml: ' + JSON.stringify(message));
}
}