mirror of
https://github.com/overte-org/overte.git
synced 2025-04-19 16:23:39 +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
|
||||
// See https://bugreports.qt.io/browse/QTBUG-49521
|
||||
|
|
|
|||
|
|
@ -18,7 +18,8 @@ var DEFAULT_SCRIPTS = [
|
|||
"system/mute.js",
|
||||
"system/goto.js",
|
||||
"system/hmd.js",
|
||||
"system/marketplaces/marketplace.js",
|
||||
//"system/marketplaces/marketplace.js",
|
||||
"system/marketplaces/clara.js",
|
||||
"system/edit.js",
|
||||
"system/mod.js",
|
||||
"system/selectAudioDevice.js",
|
||||
|
|
|
|||
|
|
@ -5,21 +5,92 @@
|
|||
// Distributed under the Apache License, Version 2.0.
|
||||
// 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 {
|
||||
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 {
|
||||
float: left;
|
||||
width: 50%;
|
||||
}
|
||||
.marketplace-tile-title {
|
||||
float:left;
|
||||
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 {
|
||||
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
|
||||
//
|
||||
// Copyright 2016 High Fidelity, Inc.
|
||||
|
|
@ -7,39 +7,60 @@
|
|||
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<title>Marketplaces</title>
|
||||
<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/marketplaces.css">
|
||||
<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="js/eventBridgeLoader.js"></script>
|
||||
<script src="js/marketplaces.js"></script>
|
||||
</head>
|
||||
<body onload='loaded();'>
|
||||
<div class="marketplaces-container">
|
||||
<div class="marketplace-tile">
|
||||
<div class="marketplace-tile-title">Hifi Marketplace</div>
|
||||
<div class="marketplace-tile-image-container">
|
||||
<a href="http://highfidelity.io/marketplace">
|
||||
<img class="marketplace-tile-image" src="http://lorempixel.com/1000/1000">
|
||||
</a>
|
||||
</div>
|
||||
<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>
|
||||
<head>
|
||||
<title>Marketplaces</title>
|
||||
<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/marketplaces.css">
|
||||
<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="js/eventBridgeLoader.js"></script>
|
||||
<script src="js/marketplaces.js"></script>
|
||||
</head>
|
||||
<body onload='loaded();'>
|
||||
<div class="marketplaces-container">
|
||||
<h2 class="marketplaces-title">
|
||||
Marketplaces
|
||||
</h2>
|
||||
<div class="marketplaces-intro-text">
|
||||
<p>
|
||||
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>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
<div class="marketplace-tile">
|
||||
<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>
|
||||
|
|
@ -14,7 +14,7 @@
|
|||
(function() { // BEGIN LOCAL_SCOPE
|
||||
|
||||
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";
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue