mirror of
https://github.com/overte-org/overte.git
synced 2025-08-08 05:57:29 +02:00
added status bar to marketplace
This commit is contained in:
elisa-lj11
parent
264176dac6
commit
f2e61aa504
7 changed files with 158 additions and 151 deletions
|
|
@ -1,103 +0,0 @@
|
||||||
//
|
|
||||||
// MarketplaceComboBox.qml
|
|
||||||
//
|
|
||||||
// Created by Elisa Lupin-Jimenez on 3 Aug 2016
|
|
||||||
// Copyright 2016 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 QtQuick 2.5
|
|
||||||
import QtQuick.Controls 1.4
|
|
||||||
import QtWebChannel 1.0
|
|
||||||
import QtWebEngine 1.1
|
|
||||||
import QtWebSockets 1.0
|
|
||||||
import "qrc:///qtwebchannel/qwebchannel.js" as WebChannel
|
|
||||||
|
|
||||||
import "controls"
|
|
||||||
import "controls-uit" as Controls
|
|
||||||
import "styles"
|
|
||||||
import "styles-uit"
|
|
||||||
|
|
||||||
|
|
||||||
Rectangle {
|
|
||||||
HifiConstants { id: hifi }
|
|
||||||
id: marketplaceComboBox
|
|
||||||
anchors.fill: parent
|
|
||||||
color: hifi.colors.baseGrayShadow
|
|
||||||
property var currentUrl: "https://metaverse.highfidelity.com/marketplace"
|
|
||||||
|
|
||||||
Controls.WebView {
|
|
||||||
id: webview
|
|
||||||
url: currentUrl
|
|
||||||
anchors.top: switchMarketView.bottom
|
|
||||||
width: parent.width
|
|
||||||
height: parent.height - 40
|
|
||||||
focus: true
|
|
||||||
|
|
||||||
Timer {
|
|
||||||
id: zipTimer
|
|
||||||
running: false
|
|
||||||
repeat: false
|
|
||||||
interval: 1500
|
|
||||||
property var handler;
|
|
||||||
onTriggered: handler();
|
|
||||||
}
|
|
||||||
|
|
||||||
property var autoCancel: 'var element = $("a.btn.cancel");
|
|
||||||
element.click();'
|
|
||||||
|
|
||||||
onNewViewRequested: {
|
|
||||||
var component = Qt.createComponent("Browser.qml");
|
|
||||||
var newWindow = component.createObject(desktop);
|
|
||||||
request.openIn(newWindow.webView);
|
|
||||||
if (File.isZippedFbx(desktop.currentUrl)) {
|
|
||||||
zipTimer.handler = function() {
|
|
||||||
newWindow.destroy();
|
|
||||||
runJavaScript(autoCancel);
|
|
||||||
}
|
|
||||||
zipTimer.start();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
property var simpleDownload: 'var element = $("a.download-file");
|
|
||||||
element.removeClass("download-file");
|
|
||||||
element.removeAttr("download");'
|
|
||||||
|
|
||||||
onLinkHovered: {
|
|
||||||
desktop.currentUrl = hoveredUrl;
|
|
||||||
// add an error message for non-fbx files
|
|
||||||
if (File.isZippedFbx(desktop.currentUrl)) {
|
|
||||||
runJavaScript(simpleDownload, function(){console.log("ran the JS");});
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
Controls.ComboBox {
|
|
||||||
id: switchMarketView
|
|
||||||
anchors.top: parent.top
|
|
||||||
anchors.right: parent.right
|
|
||||||
colorScheme: hifi.colorSchemes.dark
|
|
||||||
width: 200
|
|
||||||
height: 40
|
|
||||||
visible: true
|
|
||||||
model: ["Marketplace", "Clara.io"]
|
|
||||||
onCurrentIndexChanged: {
|
|
||||||
if (currentIndex === 0) { webview.url = "https://metaverse.highfidelity.com/marketplace"; }
|
|
||||||
if (currentIndex === 1) { webview.url = "https://clara.io/library"; }
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
Controls.Label {
|
|
||||||
id: switchMarketLabel
|
|
||||||
anchors.verticalCenter: switchMarketView.verticalCenter
|
|
||||||
anchors.right: switchMarketView.left
|
|
||||||
color: hifi.colors.white
|
|
||||||
text: "Explore interesting content from: "
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
@ -61,6 +61,14 @@ WebEngineView {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
property var newWindowHook: function (component, newWindow, request) { }; // override if you need to
|
||||||
|
onNewViewRequested:{
|
||||||
|
var component = Qt.createComponent("../Browser.qml");
|
||||||
|
var newWindow = component.createObject(desktop);
|
||||||
|
request.openIn(newWindow.webView)
|
||||||
|
newWindowHook(component, newWindow, request);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
// This breaks the webchannel used for passing messages. Fixed in Qt 5.6
|
// This breaks the webchannel used for passing messages. Fixed in Qt 5.6
|
||||||
// See https://bugreports.qt.io/browse/QTBUG-49521
|
// See https://bugreports.qt.io/browse/QTBUG-49521
|
||||||
|
|
|
||||||
|
|
@ -18,7 +18,8 @@ var DEFAULT_SCRIPTS = [
|
||||||
"system/mute.js",
|
"system/mute.js",
|
||||||
"system/goto.js",
|
"system/goto.js",
|
||||||
"system/hmd.js",
|
"system/hmd.js",
|
||||||
"system/marketplaces/marketplace.js",
|
//"system/marketplaces/marketplace.js",
|
||||||
|
"system/marketplaces/clara.js",
|
||||||
"system/edit.js",
|
"system/edit.js",
|
||||||
"system/mod.js",
|
"system/mod.js",
|
||||||
"system/selectAudioDevice.js",
|
"system/selectAudioDevice.js",
|
||||||
|
|
|
||||||
|
|
@ -5,21 +5,92 @@
|
||||||
// Distributed under the Apache License, Version 2.0.
|
// Distributed under the Apache License, Version 2.0.
|
||||||
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
|
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
|
||||||
*/
|
*/
|
||||||
|
body {
|
||||||
|
background: white;
|
||||||
|
padding: 0 0 0 0;
|
||||||
|
}
|
||||||
.marketplaces-container {
|
.marketplaces-container {
|
||||||
width: 100%;
|
display: inline-block;
|
||||||
|
color: black;
|
||||||
|
width: 94%;
|
||||||
|
margin-left: 3%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.marketplaces-title {
|
||||||
|
margin-top: 45px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
.marketplaces-intro-text {
|
||||||
|
margin-bottom: 60px;
|
||||||
}
|
}
|
||||||
.marketplace-tile {
|
.marketplace-tile {
|
||||||
float: left;
|
float:left;
|
||||||
width: 50%;
|
|
||||||
}
|
|
||||||
.marketplace-tile-title {
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 10%;
|
|
||||||
}
|
}
|
||||||
.marketplace-tile-image-container {
|
.marketplace-tile-first-column {
|
||||||
|
text-align: center;
|
||||||
|
float: left;
|
||||||
|
width: 33%;
|
||||||
}
|
}
|
||||||
.marketplace-tile-image {
|
.marketplace-tile-second-column {
|
||||||
|
float: left;
|
||||||
|
margin-left:4%;
|
||||||
|
width: 62%;
|
||||||
|
}
|
||||||
|
.exploreButton {
|
||||||
|
width: 200px !important;
|
||||||
|
height: 45px !important;
|
||||||
|
margin-top: 20px;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
}
|
||||||
|
.tile-divider {
|
||||||
|
width: 100%;
|
||||||
|
margin-left: 0%;
|
||||||
|
display: block;
|
||||||
|
height: 1px;
|
||||||
|
border: 0;
|
||||||
|
border-top: 1px solid lightgrey;
|
||||||
|
margin: 1em 0;
|
||||||
|
padding: 0;
|
||||||
|
margin-bottom: 30px;
|
||||||
}
|
}
|
||||||
.marketplace-tile-description {
|
.marketplace-tile-description {
|
||||||
|
margin-top: 15px;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
}
|
||||||
|
.marketplace-tile-image {
|
||||||
|
margin-top:15px;
|
||||||
|
max-width: 256px;
|
||||||
|
height: 128px;
|
||||||
|
margin-bottom:60px;
|
||||||
|
-webkit-box-shadow: -1px 4px 16px 0px rgba(0, 0, 0, 0.48);
|
||||||
|
-moz-box-shadow: -1px 4px 16px 0px rgba(0, 0, 0, 0.48);
|
||||||
|
box-shadow: -1px 4px 16px 0px rgba(0, 0, 0, 0.48);
|
||||||
|
}
|
||||||
|
.marketplace-clara-steps {
|
||||||
|
padding-left: 15px;
|
||||||
|
}
|
||||||
|
.marketplace-clara-steps > li {
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
@media (max-width:768px) {
|
||||||
|
.marketplace-tile-first-column {
|
||||||
|
float: left;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.marketplace-tile-second-column {
|
||||||
|
float: left;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.exploreButton-holder {
|
||||||
|
width:100%;
|
||||||
|
text-align:center;
|
||||||
|
}
|
||||||
|
.tile-divider {
|
||||||
|
width: 100%;
|
||||||
|
margin-left: 0%;
|
||||||
|
}
|
||||||
|
.marketplace-tile-image{
|
||||||
|
margin-bottom:15px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -1,3 +1,12 @@
|
||||||
function loaded(){
|
function loaded() {
|
||||||
|
bindExploreButtons();
|
||||||
|
}
|
||||||
|
|
||||||
|
function bindExploreButtons() {
|
||||||
|
$('#exploreClaraMarketplace').on('click', function () {
|
||||||
|
window.location = "https://clara.io/library?public=true"
|
||||||
|
})
|
||||||
|
$('#exploreHifiMarketplace').on('click', function () {
|
||||||
|
window.location = "http://www.highfidelity.com/marketplace"
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
<!--
|
<!--
|
||||||
// marketplaces.html
|
// marketplaces.html
|
||||||
//
|
//
|
||||||
// Copyright 2016 High Fidelity, Inc.
|
// Copyright 2016 High Fidelity, Inc.
|
||||||
|
|
@ -7,39 +7,60 @@
|
||||||
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
|
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
|
||||||
-->
|
-->
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title>Marketplaces</title>
|
<title>Marketplaces</title>
|
||||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
|
||||||
<link rel="stylesheet" type="text/css" href="css/edit-style.css">
|
<link rel="stylesheet" type="text/css" href="css/edit-style.css">
|
||||||
<link rel="stylesheet" type="text/css" href="css/marketplaces.css">
|
<link rel="stylesheet" type="text/css" href="css/marketplaces.css">
|
||||||
<script src="js/jquery-2.1.4.min.js"></script>
|
<script src="js/jquery-2.1.4.min.js"></script>
|
||||||
<script type="text/javascript" src="qrc:///qtwebchannel/qwebchannel.js"></script>
|
<script type="text/javascript" src="qrc:///qtwebchannel/qwebchannel.js"></script>
|
||||||
<script type="text/javascript" src="js/eventBridgeLoader.js"></script>
|
<script type="text/javascript" src="js/eventBridgeLoader.js"></script>
|
||||||
<script src="js/marketplaces.js"></script>
|
<script src="js/marketplaces.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body onload='loaded();'>
|
<body onload='loaded();'>
|
||||||
<div class="marketplaces-container">
|
<div class="marketplaces-container">
|
||||||
<div class="marketplace-tile">
|
<h2 class="marketplaces-title">
|
||||||
<div class="marketplace-tile-title">Hifi Marketplace</div>
|
Marketplaces
|
||||||
<div class="marketplace-tile-image-container">
|
</h2>
|
||||||
<a href="http://highfidelity.io/marketplace">
|
<div class="marketplaces-intro-text">
|
||||||
<img class="marketplace-tile-image" src="http://lorempixel.com/1000/1000">
|
<p>
|
||||||
</a>
|
You can bring content into High Fidelity forom anywhere you want. Here are a few places that support direct import of content right now. If you'd like to suggest a Market to include here, <a href="mailto:contact@highfidelity.io">let us know.</a>
|
||||||
</div>
|
</p>
|
||||||
<div class="marketplace-tile-description">This is the Hifi Marketplace</div>
|
|
||||||
</div>
|
|
||||||
<div class="marketplace-tile">
|
|
||||||
<div class="marketplace-tile">
|
|
||||||
<div class="marketplace-tile-title">Clara</div>
|
|
||||||
<div class="marketplace-tile-image-container">
|
|
||||||
<a href="http://clara.io:">
|
|
||||||
<img class="marketplace-tile-image" src="http://lorempixel.com/1000/1000">
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<div class="marketplace-tile-description">This is the Clara Marketplace</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="marketplace-tile">
|
||||||
</body>
|
<div class="marketplace-tile-first-column">
|
||||||
|
<img class="marketplace-tile-image" src="img/hifi-marketplace-tile.png">
|
||||||
|
</div>
|
||||||
|
<div class="marketplace-tile-second-column">
|
||||||
|
<p class="marketplace-tile-description">This is the default High Fidelity marketplace. Viewing and downloading content from here is fully supported in Interface.</p>
|
||||||
|
<div class="exploreButton-holder">
|
||||||
|
<input class="blue exploreButton" type="button" value="Explore" id="exploreHifiMarketplace"></input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<hr class="tile-divider">
|
||||||
|
</div>
|
||||||
|
<div class="marketplace-tile">
|
||||||
|
<div class="marketplace-tile-first-column">
|
||||||
|
<img class="marketplace-tile-image" src="img/clara-tile.png">
|
||||||
|
</div>
|
||||||
|
<div class="marketplace-tile-second-column">
|
||||||
|
<p class="marketplace-tile-description">Clara.io has thousands of models available for importing into High Fidelity. Follow these steps for the best experience:</p>
|
||||||
|
<ol class="marketplace-clara-steps">
|
||||||
|
<li><a href="http://www.clara.io/signup">Create an account here </a>or log in as an existing user.</li>
|
||||||
|
<li>Choose a model from the list and click Download -> Autodesk FBX.</li>
|
||||||
|
<li>After the file processes, click Download.</li>
|
||||||
|
<li>Add the model to your asset server, then find it from the list and choose Add To World.</li>
|
||||||
|
</ol>
|
||||||
|
<div class="exploreButton-holder">
|
||||||
|
<input class="blue exploreButton" type="button" value="Explore" id="exploreClaraMarketplace"></input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<hr class="tile-divider">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -14,7 +14,7 @@
|
||||||
(function() { // BEGIN LOCAL_SCOPE
|
(function() { // BEGIN LOCAL_SCOPE
|
||||||
|
|
||||||
var toolIconUrl = Script.resolvePath("../assets/images/tools/");
|
var toolIconUrl = Script.resolvePath("../assets/images/tools/");
|
||||||
var qml = Script.resolvePath("../../../resources/qml/MarketplaceComboBox.qml")
|
var qml = Script.resolvePath("../../../resources/qml/Marketplaces.qml")
|
||||||
|
|
||||||
var MARKETPLACE_URL = "https://metaverse.highfidelity.com/marketplace";
|
var MARKETPLACE_URL = "https://metaverse.highfidelity.com/marketplace";
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue