mirror of
https://github.com/AleziaKurdis/Overte-community-apps.git
synced 2025-08-18 07:21:23 +02:00
v1.6 (By Alezia Kurdis for Overte, August 12th, 2023) Replace the Color Picker Component (sadly GPLv3) by a simple hue selector. Add an "uninstall" button Keep the icon active if the switch is on. The appreciation dodecahedron is now emissive, and glows as the intensity grows.
88 lines
3.2 KiB
HTML
88 lines
3.2 KiB
HTML
<!DOCTYPE html>
|
|
<!--
|
|
appreciate_ui.html
|
|
|
|
Created by Zach Fox on January 30th, 2019
|
|
Copyright 2019 High Fidelity, Inc.
|
|
Copyright 2023, Overte e.V.
|
|
|
|
UI for the "Appreciate" application.
|
|
|
|
Distributed under the Apache License, Version 2.0
|
|
See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
|
|
-->
|
|
|
|
<html>
|
|
<head>
|
|
<title>Appreciate</title>
|
|
<meta charset="utf-8">
|
|
<link rel="stylesheet" type="text/css" href="css/style.css">
|
|
</head>
|
|
|
|
<body>
|
|
<div id="loadingContainer">
|
|
</div>
|
|
|
|
<div id="mainContainer">
|
|
<div id="titleBarContainer">
|
|
<div id="titleText" style="font-weight:bold;">
|
|
Appreciate v1.6
|
|
</div>
|
|
<label class="switch">
|
|
<input id="appreciateSwitch" type="checkbox" onclick="appreciateSwitchClicked(this)">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
</div>
|
|
|
|
<div id="firstRun" style="display:none;">
|
|
<i id="tutorialArrow"></i>
|
|
<div> Use this switch to enable and disable the Appreciate app.</div>
|
|
</div>
|
|
|
|
<div id="progressBarContainer">
|
|
<span style="font-weight:bold;">Intensity Meter</span>
|
|
<div id="currentIntensityDisplay">
|
|
<span id="currentIntensity" style="width:0%"></span>
|
|
</div>
|
|
<div id="crosshatch"></div>
|
|
</div>
|
|
|
|
<div id="optionsContainer">
|
|
<span style="font-weight:bold;">Options</span>
|
|
|
|
<label id="neverWhistleContainer">
|
|
Never Whistle
|
|
<input id="neverWhistleCheckbox" type="checkbox" onclick="neverWhistleCheckboxClicked(this)">
|
|
<span class="checkmark"></span>
|
|
</label>
|
|
|
|
<label id="showAppreciationEntityContainer">
|
|
Show Appreciation Dodecahedron
|
|
<input id="showAppreciationEntityCheckbox" type="checkbox" onclick="showAppreciationEntityCheckboxClicked(this)">
|
|
<span class="checkmark"></span>
|
|
</label>
|
|
<br>
|
|
<div id="colorPickerContainer">
|
|
<div id="colorPicker">Dodecahedron Color</div>
|
|
<img src="images/hueBar.jpg" id="hueSelector" draggable="false">
|
|
</div>
|
|
|
|
</div>
|
|
<div id="instructions">
|
|
<div id="desktopModeInstructions">
|
|
Desktop Mode:<br/>Tap or hold the Z key on your keyboard!
|
|
</div>
|
|
<div id="vrModeInstructions">
|
|
VR Mode:<br/>Raise your hands above your head and shake them!
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div id ="uninstallBar">
|
|
<button id="uninstall" onClick = "uninstall();">Uninstall this application</button>
|
|
</div>
|
|
<!--Include this script here so it only executes once the DOM is ready.-->
|
|
<script type="text/javascript" src="js/appreciate_ui.js"></script>
|
|
</body>
|
|
</html>
|