mirror of
https://github.com/HifiExperiments/overte.git
synced 2025-04-07 06:32:57 +02:00
Update wizard's congratulation page
This commit is contained in:
Atlante45
parent
3f5b21ec22
commit
1f23664c2f
12 changed files with 172 additions and 66 deletions
|
|
@ -1,3 +1,17 @@
|
|||
/* cairo-regular - latin */
|
||||
@font-face {
|
||||
font-family: 'Cairo';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url('/fonts/cairo-v2-latin-regular.eot'); /* IE9 Compat Modes */
|
||||
src: local('Cairo'), local('Cairo-Regular'),
|
||||
url('/fonts/cairo-v2-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
|
||||
url('/fonts/cairo-v2-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
|
||||
url('/fonts/cairo-v2-latin-regular.woff') format('woff'), /* Modern Browsers */
|
||||
url('/fonts/cairo-v2-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
|
||||
url('/fonts/cairo-v2-latin-regular.svg#Cairo') format('svg'); /* Legacy iOS */
|
||||
}
|
||||
|
||||
body {
|
||||
position: relative;
|
||||
padding-bottom: 30px;
|
||||
|
|
@ -311,7 +325,7 @@ table .headers + .headers td {
|
|||
font-size: 14px;
|
||||
text-decoration-line: underline;
|
||||
font-weight: normal;
|
||||
color: #2F80ED;
|
||||
color: #00B3F8;
|
||||
}
|
||||
|
||||
#manage-cloud-domains-link {
|
||||
|
|
|
|||
BIN
domain-server/resources/web/fonts/cairo-v2-latin-regular.eot
Normal file
BIN
domain-server/resources/web/fonts/cairo-v2-latin-regular.eot
Normal file
Binary file not shown.
|
|
@ -0,0 +1 @@
|
|||
<!DOCTYPE html><html lang=en><meta charset=utf-8><meta name=viewport content="initial-scale=1, minimum-scale=1, width=device-width"><title>Error 500 (Server Error)!!1</title><style>*{margin:0;padding:0}html,code{font:15px/22px arial,sans-serif}html{background:#fff;color:#222;padding:15px}body{color:#222;text-align:unset;margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px;}* > body{background:url(//www.google.com/images/errors/robot.png) 100% 5px no-repeat;padding-right:205px}p{margin:11px 0 22px;overflow:hidden}pre{white-space:pre-wrap;}ins{color:#777;text-decoration:none}a img{border:0}@media screen and (max-width:772px){body{background:none;margin-top:0;max-width:none;padding-right:0}}#logo{background:url(//www.google.com/images/branding/googlelogo/1x/googlelogo_color_150x54dp.png) no-repeat;margin-left:-5px}@media only screen and (min-resolution:192dpi){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat 0% 0%/100% 100%;-moz-border-image:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) 0}}@media only screen and (-webkit-min-device-pixel-ratio:2){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat;-webkit-background-size:100% 100%}}#logo{display:inline-block;height:54px;width:150px}</style><div id="af-error-container"><a href=//www.google.com><span id=logo aria-label=Google></span></a><p><b>500.</b> <ins>That’s an error.</ins><p>There was an error. Please try again later. <ins>That’s all we know.</ins></div>
|
||||
BIN
domain-server/resources/web/fonts/cairo-v2-latin-regular.ttf
Normal file
BIN
domain-server/resources/web/fonts/cairo-v2-latin-regular.ttf
Normal file
Binary file not shown.
BIN
domain-server/resources/web/fonts/cairo-v2-latin-regular.woff
Normal file
BIN
domain-server/resources/web/fonts/cairo-v2-latin-regular.woff
Normal file
Binary file not shown.
BIN
domain-server/resources/web/fonts/cairo-v2-latin-regular.woff2
Normal file
BIN
domain-server/resources/web/fonts/cairo-v2-latin-regular.woff2
Normal file
Binary file not shown.
|
|
@ -1,25 +0,0 @@
|
|||
<svg width="676" height="676" viewBox="0 0 676 676" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>CongratulationImage</title>
|
||||
<desc>Created using Figma</desc>
|
||||
<g id="Canvas" transform="matrix(4 0 0 4 -21208 -17980)">
|
||||
<g id="CongratulationImage">
|
||||
<g id="Ellipse">
|
||||
<use xlink:href="#path0_fill" transform="translate(5302 4495)" fill="#FFFFFF"/>
|
||||
<mask id="mask0_outline_ins">
|
||||
<use xlink:href="#path0_fill" fill="white" transform="translate(5302 4495)"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_outline_ins)">
|
||||
<use xlink:href="#path1_stroke_2x" transform="translate(5302 4495)" fill="#219653"/>
|
||||
</g>
|
||||
</g>
|
||||
<g id="Vector 2">
|
||||
<use xlink:href="#path2_stroke" transform="translate(5355 4559)" fill="#219653"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<path id="path0_fill" d="M 169 84.5C 169 131.168 131.168 169 84.5 169C 37.8319 169 0 131.168 0 84.5C 0 37.8319 37.8319 0 84.5 0C 131.168 0 169 37.8319 169 84.5Z"/>
|
||||
<path id="path1_stroke_2x" d="M 154 84.5C 154 122.884 122.884 154 84.5 154L 84.5 184C 139.452 184 184 139.452 184 84.5L 154 84.5ZM 84.5 154C 46.1162 154 15 122.884 15 84.5L -15 84.5C -15 139.452 29.5477 184 84.5 184L 84.5 154ZM 15 84.5C 15 46.1162 46.1162 15 84.5 15L 84.5 -15C 29.5477 -15 -15 29.5477 -15 84.5L 15 84.5ZM 84.5 15C 122.884 15 154 46.1162 154 84.5L 184 84.5C 184 29.5477 139.452 -15 84.5 -15L 84.5 15Z"/>
|
||||
<path id="path2_stroke" d="M 5.18747 19.8031C 2.19593 16.9382 -2.5517 17.0408 -5.41666 20.0323C -8.28162 23.0238 -8.17901 27.7715 -5.18747 30.6364L 5.18747 19.8031ZM 20.6541 45L 15.4667 50.4167C 18.3816 53.2083 22.9831 53.1924 25.8787 50.3809L 20.6541 45ZM 72.2246 5.38085C 75.1964 2.49539 75.2663 -2.25283 72.3809 -5.2246C 69.4954 -8.19636 64.7472 -8.26632 61.7754 -5.38085L 72.2246 5.38085ZM -5.18747 30.6364L 15.4667 50.4167L 25.8416 39.5833L 5.18747 19.8031L -5.18747 30.6364ZM 25.8787 50.3809L 72.2246 5.38085L 61.7754 -5.38085L 15.4295 39.6191L 25.8787 50.3809Z"/>
|
||||
</defs>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.9 KiB |
17
domain-server/resources/web/images/copy-icon.svg
Normal file
17
domain-server/resources/web/images/copy-icon.svg
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 22.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 576 576" style="enable-background:new 0 0 576 576;" xml:space="preserve">
|
||||
<path d="M329.7,410.7H127.8c-42.1,0-76.4-34.3-76.4-76.4V132.4c0-42.1,34.3-76.4,76.4-76.4h201.9c42.1,0,76.4,34.3,76.4,76.4v201.9
|
||||
C406.1,376.4,371.8,410.7,329.7,410.7z M127.8,98.9c-18.5,0-33.5,15-33.5,33.5v201.9c0,18.5,15,33.5,33.5,33.5h201.9
|
||||
c18.5,0,33.5-15,33.5-33.5V132.4c0-18.5-15-33.5-33.5-33.5H127.8z"/>
|
||||
<path d="M449.4,519H407c-11.9,0-21.5-9.6-21.5-21.5s9.6-21.5,21.5-21.5h42.4c11.9,0,21.5,9.6,21.5,21.5S461.3,519,449.4,519z
|
||||
M305.1,519H263c-11.9,0-21.5-9.6-21.5-21.5s9.6-21.5,21.5-21.5h42.2c11.9,0,21.5,9.6,21.5,21.5S317,519,305.1,519z M192.4,464.1
|
||||
c-11.9,0-21.5-9.6-21.5-21.4v-42.2c0-11.9,9.6-21.5,21.5-21.5c11.9,0,21.5,9.6,21.5,21.5v42.1C213.8,454.5,204.2,464.1,192.4,464.1z
|
||||
M504.1,448.2c-11.9,0-21.5-9.6-21.5-21.5v-42.2c0-11.9,9.6-21.5,21.5-21.5c11.9,0,21.5,9.6,21.5,21.5v42.2
|
||||
C525.6,438.6,516,448.2,504.1,448.2z M192.4,320.1c-11.9,0-21.5-9.6-21.5-21.5v-42.2c0-11.9,9.6-21.5,21.5-21.5
|
||||
c11.9,0,21.5,9.6,21.5,21.5v42.2C213.8,310.5,204.2,320.1,192.4,320.1z M504.1,304.1c-11.9,0-21.5-9.6-21.5-21.5v-42
|
||||
c0-11.9,9.6-21.6,21.5-21.6c11.9,0,21.5,9.5,21.5,21.4v42.2C525.6,294.5,516,304.1,504.1,304.1z M433.4,207.2h-42.2
|
||||
c-11.9,0-21.5-9.6-21.5-21.5s9.6-21.5,21.5-21.5h42.2c11.9,0,21.5,9.6,21.5,21.5S445.3,207.2,433.4,207.2z M289.3,207.2h-42.1
|
||||
c-11.9,0-21.5-9.6-21.5-21.5s9.6-21.5,21.4-21.5h42.2c11.9,0,21.5,9.6,21.5,21.5S301.2,207.2,289.3,207.2z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 137 KiB |
|
|
@ -83,21 +83,80 @@ label {
|
|||
margin-bottom: 33px;
|
||||
}
|
||||
|
||||
#checkmark-image {
|
||||
margin-top: 66px;
|
||||
margin-bottom: 59px;
|
||||
width: 169px;
|
||||
height: 169px;
|
||||
.btn.btn-square {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
#congratulation-text {
|
||||
margin-bottom: 59px;
|
||||
.header {
|
||||
position: absolute;
|
||||
top: -20px;
|
||||
left: 50%;
|
||||
margin-left: -720px; /* Half of the width */
|
||||
min-width: 1440px;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
#visit-domain-checkbox {
|
||||
margin-bottom: 23px;
|
||||
.title {
|
||||
font-family: 'Cairo';
|
||||
color: white;
|
||||
margin-top: 260px;
|
||||
}
|
||||
|
||||
#visit-domain-checkbox label {
|
||||
margin: 0 0;
|
||||
#main-description {
|
||||
margin-top: 32px;
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
|
||||
#share-box {
|
||||
background-color: rgb(240, 240, 240);
|
||||
padding: 20px 20px;
|
||||
margin-top: 15px;
|
||||
margin-bottom: 70px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
#share-box > span {
|
||||
vertical-align: middle;
|
||||
display: table-cell;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#share-box button {
|
||||
border-color: rgb(225, 225, 225);
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
#share-box img {
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
#share-text {
|
||||
font-size: 22px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
|
||||
#share-field {
|
||||
background-color: rgb(255, 255, 255);
|
||||
padding: 0 10px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#share-link {
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
#congrats-list > div > div {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
#congrats-list ul {
|
||||
padding-left: 16px;
|
||||
}
|
||||
|
||||
#congrats-list {
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
#open-settings {
|
||||
border-color: black;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -191,29 +191,70 @@
|
|||
</dl>
|
||||
</div>
|
||||
|
||||
<div class="wizard-step cloud-only col-xs-12 col-sm-12 col-md-9 col-lg-7 col-centered" style="display: none;">
|
||||
<div id="congratulation-step" class="wizard-step cloud-only col-xs-12 col-centered" style="display: none;">
|
||||
<div class="row">
|
||||
<div class="col-xs-12" align="center">
|
||||
<img id="checkmark-image" src="../images/checkmark.svg">
|
||||
<div class="col-xs-10 col-xs-offset-1">
|
||||
<img class="header" src="/images/wizard-congratulation-header.jpg" alt="Header" width="1440" height="339">
|
||||
<h1 class="title">Congratulations!</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="congratulation-text" class="row">
|
||||
<div class="col-xs-12">
|
||||
<p class="step-info">Congratulations! You have successfully setup and configured your cloud hosted domain.</p>
|
||||
<div class="row">
|
||||
<div class="col-xs-10 col-xs-offset-1">
|
||||
<p id="main-description" class="step-info">You have successfully setup and configured your cloud hosted domain.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<dl class="row">
|
||||
<div class="col-xs-12">
|
||||
<div class="pull-right">
|
||||
<div id="visit-domain-checkbox">
|
||||
<label><input id="go-to-domain" class="form-check-input" type="checkbox"> Visit domain in VR now</label>
|
||||
</div>
|
||||
<button id="explore-settings" type="button" class="btn btn-md btn-primary">Explore all domain server settings</button>
|
||||
<div class="row">
|
||||
<div class="col-xs-10 col-xs-offset-1">
|
||||
<div class="step-info">
|
||||
<b>Invite people in!</b>
|
||||
</div>
|
||||
<div id="share-box">
|
||||
<span id="share-text" class="step-info">Share your domain:</span>
|
||||
<span id="share-field">
|
||||
<a id="share-link" class="blue-link" target="_blank"></a>
|
||||
</span>
|
||||
<span>
|
||||
<button type="button" class="btn btn-md btn-default btn-square" onclick="copyToClipboard('#share-link')">
|
||||
<img src="/images/copy-icon.svg" alt="cpy icon" height="30" width="30">copy
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</dl>
|
||||
</div>
|
||||
|
||||
<div id="congrats-list" class="row">
|
||||
<div class="col-xs-4 col-xs-offset-1">
|
||||
<div class="step-info">
|
||||
<b>Go to your Domain:</b>
|
||||
</div>
|
||||
<ul>
|
||||
<li class="step-info">Browse environments in the Marketplace to select the perfect content set for your VR world.</li>
|
||||
<li class="step-info">Invite people to your domain right now.</li>
|
||||
<li class="step-info">Meet new people and explore other domains.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-xs-3 col-xs-offset-1">
|
||||
<div class="step-info">
|
||||
<b>Continue to Domain settings:</b>
|
||||
</div>
|
||||
<ul>
|
||||
<li class="step-info">Set additional permissions for who can visit and make changes.</li>
|
||||
<li class="step-info">Adjust audio settings.</li>
|
||||
<li class="step-info">Back up your domain's content.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-xs-4 col-xs-offset-1">
|
||||
<button id="visit-domain" type="button" class="btn btn-md btn-primary btn-square">Visit Your VR World</button>
|
||||
</div>
|
||||
<div class="col-xs-3 col-xs-offset-1">
|
||||
<button id="open-settings" type="button" class="btn btn-md btn-default btn-square next-button">Open Domain Settings</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--#include virtual="footer.html"-->
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ $(document).ready(function(){
|
|||
$('#connect-account-btn').attr('href', URLs.METAVERSE_URL + "/user/tokens/new?for_domain_server=true");
|
||||
|
||||
$('[data-toggle="tooltip"]').tooltip();
|
||||
|
||||
|
||||
$('.perms-link').on('click', function() {
|
||||
var modal_body = '<div>';
|
||||
modal_body += '<b>None</b> - No one will have permissions. Only you and the users your have given administrator privileges to will have permissions.</br></br>';
|
||||
|
|
@ -70,8 +70,8 @@ $(document).ready(function(){
|
|||
});
|
||||
});
|
||||
|
||||
$('body').on('click', '#explore-settings', function() {
|
||||
exploreSettings();
|
||||
$('body').on('click', '#visit-domain', function() {
|
||||
$('#share-link')[0].click();
|
||||
});
|
||||
|
||||
$('input[type=radio][name=connect-radio]').change(function() {
|
||||
|
|
@ -120,6 +120,14 @@ $(document).ready(function(){
|
|||
});
|
||||
});
|
||||
|
||||
function copyToClipboard(element) {
|
||||
var $temp = $("<input>");
|
||||
$("body").append($temp);
|
||||
$temp.val($(element).text()).select();
|
||||
document.execCommand("copy");
|
||||
$temp.remove();
|
||||
}
|
||||
|
||||
function setupWizardSteps() {
|
||||
currentStepNumber = Settings.data.values.wizard.steps_completed;
|
||||
var steps = null;
|
||||
|
|
@ -155,7 +163,9 @@ function setupWizardSteps() {
|
|||
|
||||
function updatePlaceNameLink(address) {
|
||||
if (address) {
|
||||
$('#place-name-link').html('Your domain is reachable at: <a target="_blank" href="' + URLs.PLACE_URL + '/' + address + '">' + address + '</a>');
|
||||
var url = URLs.PLACE_URL + '/' + address;
|
||||
$('#place-name-link').html('Your domain is reachable at: <a target="_blank" href="' + url + '">' + address + '</a>');
|
||||
$('#share-field a').attr('href', url).text(url);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -507,14 +517,3 @@ function saveUsernamePassword() {
|
|||
location.reload();
|
||||
});
|
||||
}
|
||||
|
||||
function exploreSettings() {
|
||||
if ($('#go-to-domain').is(":checked")) {
|
||||
var link = $('#place-name-link a:first');
|
||||
if (link.length > 0) {
|
||||
window.open(link.attr("href"));
|
||||
}
|
||||
}
|
||||
|
||||
goToNextStep();
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue