Final touch-ups.

This commit is contained in:
Kalila L 2021-02-04 03:03:50 -05:00
parent 8b1664cfb5
commit 4d7011563e
4 changed files with 146 additions and 25 deletions

View file

@ -12,11 +12,20 @@
html, html,
body { body {
background-color: transparent !important; background-color: transparent !important;
overflow: hidden !important; /* Hide scrollbars */
} }
.theme--dark.v-application { .theme--dark.v-application {
background-color: transparent !important; background-color: transparent !important;
} }
.v-text-field input {
font-size: 1.3em;
}
.v-text-field label {
font-size: 1.3em;
}
</style> </style>
</head> </head>
<body> <body>

View file

@ -10,10 +10,6 @@
// //
--> -->
<script>
/* eslint-disable */
</script>
<template> <template>
<v-app> <v-app>
<v-main> <v-main>
@ -25,7 +21,7 @@
<script> <script>
import FirstRunWizard from './components/FirstRunWizard'; import FirstRunWizard from './components/FirstRunWizard';
var vue_this; // var vue_this;
function browserDevelopment() { function browserDevelopment() {
if (typeof EventBridge !== 'undefined') { if (typeof EventBridge !== 'undefined') {
@ -79,7 +75,7 @@ export default {
}, },
created: function () { created: function () {
vue_this = this; // vue_this = this;
this.$vuetify.theme.dark = this.useDarkTheme; this.$vuetify.theme.dark = this.useDarkTheme;
this.sendMessageToScript('ready', ''); this.sendMessageToScript('ready', '');

View file

@ -39,10 +39,19 @@
</v-stepper-step> </v-stepper-step>
<v-divider></v-divider> <v-divider></v-divider>
<v-stepper-step <v-stepper-step
:complete="stepperModel > 4" :complete="stepperModel > 4"
step="4" step="4"
>
Nickname
</v-stepper-step>
<v-divider></v-divider>
<v-stepper-step
:complete="stepperModel > 5"
step="5"
> >
Ready! Ready!
</v-stepper-step> </v-stepper-step>
@ -69,7 +78,9 @@
First, we need to select some performance and graphics quality options. <br/><br/> First, we need to select some performance and graphics quality options. <br/><br/>
Press <b style="color: white;">Continue</b> when you are ready. Press <b style="color: white;">Continue</b> when you are ready.
</v-card-subtitle> </v-card-subtitle>
<v-divider></v-divider>
<v-card-actions> <v-card-actions>
<v-spacer></v-spacer> <v-spacer></v-spacer>
<v-btn <v-btn
@ -97,32 +108,37 @@
</v-img> </v-img>
<v-card-text> <v-card-text>
<v-radio-group v-model="performancePreset"> <v-radio-group
mandatory
v-model="performancePreset"
>
<template v-slot:label> <template v-slot:label>
<div class="text-h5 font-weight-light mb-5"> <div class="text-h5 font-weight-light mb-5">
What level of visual quality do you want?<br/> What level of visual quality would you like?<br/>
<b>Remember! If you do not have a powerful computer, you may want to set this to low or medium at most.</b> <b>Remember! If you do not have a powerful computer, you may want to set this to low or medium at most.</b>
</div> </div>
</template> </template>
<v-radio> <v-radio value="1">
<template v-slot:label> <template v-slot:label>
<div class="text-h5"><strong class="green--text">Low Quality</strong>; Average Laptop / Slow Computer</div> <div class="text-h5"><strong class="green--text">Low Quality</strong> Average Laptop / Slow Computer</div>
</template> </template>
</v-radio> </v-radio>
<v-radio> <v-radio value="2">
<template v-slot:label> <template v-slot:label>
<div class="text-h5"><strong class="blue--text">Medium Quality</strong> Average Computer</div> <div class="text-h5"><strong class="blue--text">Medium Quality</strong> Average Computer - <b><i>Recommended</i></b></div>
</template> </template>
</v-radio> </v-radio>
<v-radio> <v-radio value="3">
<template v-slot:label> <template v-slot:label>
<div class="text-h5"><strong class="red--text">High Quality</strong>; Gaming Computer</div> <div class="text-h5"><strong class="red--text">High Quality</strong> Gaming Computer</div>
</template> </template>
</v-radio> </v-radio>
</v-radio-group> </v-radio-group>
</v-card-text> </v-card-text>
<v-divider></v-divider>
<v-card-actions> <v-card-actions>
<v-btn <v-btn
color="primary" color="primary"
@ -180,6 +196,8 @@
</v-radio> </v-radio>
</v-radio-group> </v-radio-group>
</v-card-text> </v-card-text>
<v-divider></v-divider>
<v-card-actions> <v-card-actions>
<v-btn <v-btn
@ -202,6 +220,54 @@
</v-stepper-content> </v-stepper-content>
<v-stepper-content step="4"> <v-stepper-content step="4">
<v-card>
<v-img
height="80px"
src="/assets/1920_bar.png"
>
<v-card-title
class="text-h3 font-weight-light"
>
Display Name
</v-card-title>
</v-img>
<v-card-text>
<div class="text-h5 font-weight-light mb-5">
What should people call you?<br/>
This is simply a nickname, it will be shown in place of your username (if you have one).
</div>
<v-text-field
label="Display Name"
v-model="displayName"
placeholder="Don't be shy!"
></v-text-field>
</v-card-text>
<v-divider></v-divider>
<v-card-actions>
<v-btn
color="primary"
@click="stepperModel--"
x-large
>
Back
</v-btn>
<v-spacer></v-spacer>
<v-btn
color="primary"
@click="stepperModel++"
x-large
>
Continue
</v-btn>
</v-card-actions>
</v-card>
</v-stepper-content>
<v-stepper-content step="5">
<v-card> <v-card>
<v-img <v-img
height="80px" height="80px"
@ -221,6 +287,8 @@
Take a look at the controls reference after completing this wizard.<br/> Take a look at the controls reference after completing this wizard.<br/>
Press <b style="color: white;">Complete</b> when you are ready. Press <b style="color: white;">Complete</b> when you are ready.
</v-card-subtitle> </v-card-subtitle>
<v-divider></v-divider>
<v-card-actions> <v-card-actions>
<v-btn <v-btn
@ -255,7 +323,8 @@ export default {
'command': 'complete-wizard', 'command': 'complete-wizard',
'data': { 'data': {
'performancePreset': this.performancePreset, 'performancePreset': this.performancePreset,
'refreshRateProfile': this.refreshRateProfile 'refreshRateProfile': this.refreshRateProfile,
'displayName': this.displayName
} }
} }
@ -269,7 +338,8 @@ export default {
data: () => ({ data: () => ({
stepperModel: 1, stepperModel: 1,
performancePreset: 0, performancePreset: 0,
refreshRateProfile: 0 refreshRateProfile: 0,
displayName: ''
}) })
} }
</script> </script>

View file

@ -13,20 +13,66 @@
// //
(function() { // BEGIN LOCAL_SCOPE (function() { // BEGIN LOCAL_SCOPE
// Check to see if we should run this script or bail...
var SETTING_TO_CHECK = 'firstRun'; var SETTING_TO_CHECK = 'firstRun';
var DEFAULT_DISPLAY_NAME = '';
if (!Settings.getValue(SETTING_TO_CHECK, false)) { if (!Settings.getValue(SETTING_TO_CHECK, false)) {
return; return;
} }
if (MyAvatar.displayName === '') { // If this is our first run then proceed...
var selectedDisplayName = Window.prompt('Enter a display name.', MyAvatar.displayName);
if (selectedDisplayName === '') { var configWizardEntityID;
var DEFAULT_DISPLAY_NAME = '';
if (!PlatformInfo.has3DHTML()) {
if (MyAvatar.displayName === '') {
var selectedDisplayName = Window.prompt('Enter a display name.', MyAvatar.displayName);
setDisplayName(selectedDisplayName);
}
} else {
configWizardEntityID = Entities.addEntity({
type: 'Web',
sourceUrl: Script.resolvePath("./configWizard/dist/index.html"),
maxFPS: 60,
dpi: 20,
useBackground: false,
grab: {
grabbable: false
},
position: Vec3.sum(MyAvatar.position, Vec3.multiplyQbyV(MyAvatar.orientation, { x: 0, y: 0, z: -2.25 })),
rotation: MyAvatar.orientation,
dimensions: { x: 1.4, y: 0.75, z: 0 }
}, 'local');
Entities.webEventReceived.connect(onWebAppEventReceived);
}
function setDisplayName(displayName) {
if (displayName === '') {
MyAvatar.displayName = DEFAULT_DISPLAY_NAME; MyAvatar.displayName = DEFAULT_DISPLAY_NAME;
} else { } else {
MyAvatar.displayName = selectedDisplayName; MyAvatar.displayName = displayName;
} }
} }
function onWebAppEventReceived(sendingEntityID, event) {
if (sendingEntityID === configWizardEntityID) {
var eventJSON = JSON.parse(event);
if (eventJSON.command === "complete-wizard") {
Performance.setPerformancePreset(eventJSON.data.performancePreset);
Performance.setRefreshRateProfile(eventJSON.data.refreshRateProfile);
setDisplayName(eventJSON.data.displayName);
Entities.deleteEntity(configWizardEntityID);
Entities.webEventReceived.disconnect(onWebAppEventReceived);
}
}
}
Script.scriptEnding.connect(function () {
if (configWizardEntityID) {
Entities.deleteEntity(configWizardEntityID);
Entities.webEventReceived.disconnect(onWebAppEventReceived);
}
});
}()); }());