Set to a working state.

This commit is contained in:
PeekabooSteam 2023-02-19 11:06:17 +00:00
parent d4ef5488cc
commit 853af46483
14 changed files with 210 additions and 1976 deletions

1705
client/package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -25,7 +25,6 @@
"@types/gtag.js": "^0.0.12",
"browserify": "^17.0.0",
"concurrently": "^7.6.0",
"firebase": "^9.17.1",
"nodemon": "^2.0.20",
"tsify": "^5.0.4",
"typescript": "^4.9.4",

View File

@ -0,0 +1,194 @@
/**************************************/
.olympus-dialog {
align-self: center;
background:white;
border-radius: 10px;
display: flex;
flex-direction: column;
justify-self: center;
padding:10px;
position:absolute;
width:fit-content;
z-index: 9999;
}
.olympus-dialog-close {
cursor:pointer;
position:absolute;
right:10px;
top:5px;
}
.olympus-dialog-header {
font-weight:bold;
}
/**************************************/
/***** AIC *****/
.aic-panel {
z-index: 9999;
}
#aic-control-panel {
bottom:30px;
position: absolute;
left:30px;
}
#aic-control-panel .olympus-button img {
max-width: 32px;
}
#aic-toolbox, #aic-callsign-panel {
align-items: flex-start;
align-self: center;
flex-direction: column;
row-gap: 10px;
display:none;
position:absolute;
}
.aic-panel {
background:#eaeaea;
border-bottom-right-radius: 10px;
border-top-right-radius: 10px;
justify-self: left;
padding:5px 10px;
}
.aic-enabled #aic-toolbox, .aic-enabled #aic-callsign-panel {
display:flex;
}
.aic-enabled #aic-callsign-panel {
align-self: auto;
top: 100px;
}
.aic-panel h2 {
font-size:90%;
margin:0;
padding:0;
text-align: center;
}
#aic-callsign-display {
text-align: center;
}
#aic-formation-list {
display:flex;
flex-direction: column;
justify-content: center;
}
#aic-formation-list > div {
align-items: center;
cursor: pointer;
display:flex;
flex-direction: column;
justify-content: center;
margin-top:10px;
position:relative;
}
#aic-formation-list .aic-formation-image img {
border: 1px solid #ccc;
border-radius: 10px;
max-width: 50px;
}
#aic-formation-list .aic-formation-name {
font-size:90%;
}
#aic-formation-list .aic-formation-descriptor {
background:white;
border-radius: 10px;
left:100px;
padding:5px;
position:absolute;
width: max-content;
}
#aic-teleprompt {
background-color: white;
border:2px solid black;
border-radius: 10px;
bottom: 50px;
color: black;
display: none;
justify-content: center;
justify-self: center;
padding: 10px;
position: absolute;
width: fit-content;
z-index: 1000;
}
.aic-enabled #aic-teleprompt {
display:flex;
}
#aic-descriptor {
display:flex;
flex-direction: row;
}
#aic-descriptor .aic-descriptor-section {
display:flex;
flex-direction: column;
margin:0 10px;
}
#aic-descriptor .aic-descriptor-section-label {
background-color:#eaeaea;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
padding:.25em;
text-align: center;
}
#aic-descriptor .aic-descriptor-phrase {
border-bottom: 1px solid #ccc;
display:flex;
flex-direction: row;
margin-bottom:5px;
padding-bottom:2px;
}
#aic-descriptor .aic-descriptor-phrase:last-of-type {
margin-bottom: 0;
}
#aic-descriptor .aic-descriptor-components .aic-descriptor-component {
margin:0 5px;
text-align: center;
}
#aic-descriptor .aic-descriptor-component-label {
display:none;
}
#aic-descriptor .aic-descriptor-component-value:after {
content:",";
margin-right:5px;
}
#aic-descriptor .aic-descriptor-component:last-of-type .aic-descriptor-component-value:after {
content:"; ";
}
#aic-descriptor .aic-descriptor-section:last-of-type .aic-descriptor-component:last-of-type .aic-descriptor-component-value:after {
content:".";
}
/**************************************/

View File

@ -1,7 +1,7 @@
/* Page style */
body {
display: grid;
display:grid;
margin: 0;
padding: 0;
}
@ -42,37 +42,7 @@ body {
width: 200px;
}
/**************************************/
.olympus-dialog {
align-self: center;
background:white;
border-radius: 10px;
display: flex;
flex-direction: column;
justify-self: center;
padding:10px;
position:absolute;
width:fit-content;
z-index: 9999;
}
.olympus-dialog-close {
cursor:pointer;
position:absolute;
right:10px;
top:5px;
}
.olympus-dialog-header {
font-weight:bold;
}
/**************************************/
.control-panel {
#visibility-control-panel {
position: absolute;
left: 230px;
height: 30px;
@ -80,182 +50,12 @@ body {
top: 10px;
z-index: 1000;
display: flex;
align-items: center;
}
.control-panel-top {
height: 30px;
justify-content: space-between;
top: 10px;
align-items: center;
padding-left: 10px;
padding-right: 10px;
}
#visibility-control-panel {
left: 430px;
width: 110;
}
/***** AIC *****/
#aic-control-panel {
left: 550px;
}
#aic-control-panel .olympus-button {
filter:invert(100%);
}
#aic-toolbox, #aic-callsign-panel {
align-items: flex-start;
align-self: center;
flex-direction: column;
row-gap: 10px;
display:none;
position:absolute;
}
.aic-panel {
background:#eaeaea;
border-bottom-right-radius: 10px;
border-top-right-radius: 10px;
justify-self: left;
padding:5px 10px;
}
.aic-enabled #aic-toolbox, .aic-enabled #aic-callsign-panel {
display:flex;
}
.aic-enabled #aic-callsign-panel {
align-self: auto;
top: 100px;
}
.aic-panel h2 {
font-size:90%;
margin:0;
padding:0;
text-align: center;
}
#aic-callsign-display {
text-align: center;
}
#aic-formation-list {
display:flex;
flex-direction: column;
justify-content: center;
}
#aic-formation-list > div {
align-items: center;
cursor: pointer;
display:flex;
flex-direction: column;
justify-content: center;
margin-top:10px;
position:relative;
}
#aic-formation-list .aic-formation-image img {
border: 1px solid #ccc;
border-radius: 10px;
max-width: 50px;
}
#aic-formation-list .aic-formation-name {
font-size:90%;
}
#aic-formation-list .aic-formation-descriptor {
background:white;
border-radius: 10px;
left:100px;
padding:5px;
position:absolute;
width: max-content;
}
#aic-teleprompt {
background-color: white;
border:2px solid black;
border-radius: 10px;
bottom: 50px;
color: black;
display: none;
justify-content: center;
justify-self: center;
padding: 10px;
position: absolute;
width: fit-content;
z-index: 1000;
}
.aic-enabled #aic-teleprompt {
display:flex;
}
#aic-descriptor {
display:flex;
flex-direction: row;
}
#aic-descriptor .aic-descriptor-section {
display:flex;
flex-direction: column;
margin:0 10px;
}
#aic-descriptor .aic-descriptor-section-label {
background-color:#eaeaea;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
padding:.25em;
text-align: center;
}
#aic-descriptor .aic-descriptor-phrase {
border-bottom: 1px solid #ccc;
display:flex;
flex-direction: row;
margin-bottom:5px;
padding-bottom:2px;
}
#aic-descriptor .aic-descriptor-phrase:last-of-type {
margin-bottom: 0;
}
#aic-descriptor .aic-descriptor-components .aic-descriptor-component {
margin:0 5px;
text-align: center;
}
#aic-descriptor .aic-descriptor-component-label {
display:none;
}
#aic-descriptor .aic-descriptor-component-value:after {
content:",";
margin-right:5px;
}
#aic-descriptor .aic-descriptor-component:last-of-type .aic-descriptor-component-value:after {
content:"; ";
}
#aic-descriptor .aic-descriptor-section:last-of-type .aic-descriptor-component:last-of-type .aic-descriptor-component-value:after {
content:".";
}
/**************************************/
#unit-control-buttons {
position: fixed;
top: 10px;
@ -305,7 +105,6 @@ body {
.hide {
display:none !important;
}

View File

@ -15,6 +15,8 @@
@import url("unitinfopanel.css");
@import url("mouseinfopanel.css");
@import url( "aic.css" );
@import url("layout.css");

View File

@ -1,4 +1,3 @@
import { firestore } from "../firebase";
export interface ATCAPIInterface {
get: CallableFunction
@ -6,10 +5,10 @@ export interface ATCAPIInterface {
export abstract class ATCAPI {
firestore;
constructor() {
this.firestore = firestore;
}
}

View File

@ -1 +0,0 @@
export class ATCFlightBoard {}

View File

@ -1,24 +0,0 @@
import { ATCAPI, ATCAPIInterface } from "../ATCAPI";
import { collection, getDocs } from "firebase/firestore";
import { firebase } from "../../firebase";
export class ATCAPI_Flights extends ATCAPI implements ATCAPIInterface {
constructor() {
super();
}
get() {
async () => {
const snapshot = await getDocs( collection( this.firestore, "flights" ) );
snapshot.forEach( doc => {
console.log( doc.data() );
});
}
}
}

View File

@ -1,28 +0,0 @@
// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
import { getAnalytics } from "firebase/analytics";
import { getFirestore } from "firebase/firestore";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
apiKey: "AIzaSyArFxFtLvZqV6RKMxZR-zCH-TT3LV43aVg",
authDomain: "dcs-olympus.firebaseapp.com",
projectId: "dcs-olympus",
storageBucket: "dcs-olympus.appspot.com",
messagingSenderId: "393187308632",
appId: "1:393187308632:web:545dc9551716a84d3c462d",
measurementId: "G-10E10S2WBN"
};
// Initialize Firebase
const firebase = initializeApp( firebaseConfig );
const analytics = getAnalytics( firebase );
const firestore = getFirestore( firebase );
export { firebase, analytics, firestore };

View File

@ -102,9 +102,6 @@ function setup() {
}
});
/* Default values */

View File

@ -33,8 +33,7 @@
], /* Specify multiple folders that act like './node_modules/@types'. */
"types": [
"leaflet",
"geojson",
"@types/gtag.js"
"geojson"
], /* Specify type package names to be included without being referenced in a source file. */
// "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */
// "moduleSuffixes": [], /* List of file name suffixes to search when resolving a module. */

View File

@ -1,4 +1,4 @@
<div class="olympus-panel control-panel control-panel-top" id="aic-control-panel">
<div class="ol-panel aic-panel" id="aic-control-panel">
<div class="olympus-button" id="toggle-aic-button"></div>
<div class="olympus-button" id="aic-help-button"></div>
</div>

View File

@ -1,4 +1,4 @@
<div id="aic-callsign-panel" class="control-panel">
<div id="aic-callsign-panel" class="aic-panel">
<div class="aic-panel">
<h2>My callsign</h2>
@ -8,9 +8,9 @@
</div>
<div id="aic-toolbox" class="control-panel">
<div id="aic-toolbox" class="aic-panel">
<div id="aic-control-type" class="aic-panel">
<div id="aic-control-type" class="aic-toolbox-panel">
<h2>Control</h2>
<div>
<input type="radio" name="control-type" id="control-type-broadcast" value="broadcast" checked="checked" />
@ -22,7 +22,7 @@
</div>
</div>
<div id="aic-formation-panel" class="aic-panel">
<div id="aic-formation-panel" class="aic-toolbox-panel">
<h2>Formations</h2>

View File

@ -31,6 +31,9 @@
<%- include('visibilitycontrolpanel.ejs') %>
<%- include('connectionstatuspanel.ejs') %>
<%- include('mouseinfopanel.ejs') %>
<%- include('aiccontrolpanel.ejs') %>
<%- include('aicformationpanel.ejs') %>
<script src="javascripts/bundle.js"></script>
</body>