Commit for SPK

cardinalhorizon · Sep 1, 2020 · 2e5612f · 2e5612f
1 parent d5c53fd
commit 2e5612f
Show file tree

Hide file tree

Showing 20 changed files with 189 additions and 632 deletions.
diff --git a/Http/Controllers/MaterialCrewReduxController.php b/Http/Controllers/MaterialCrewReduxController.php
@@ -8,6 +8,11 @@
 
 class MaterialCrewReduxController extends Controller
 {
+    public function __construct()
+    {
+        $this->middleware('auth');
+    }
+
     /**
      * Display a listing of the resource.
      * @return Response

diff --git a/Resources/assets/js/App.vue b/Resources/assets/js/App.vue
@@ -6,6 +6,11 @@
     </v-app>
 </template>
 
+<style>
+    .v-application {
+        font-family: Europa Roboto sans-serif;
+    }
+</style>
 <script>
     const default_layout = "main";
     export default {

diff --git a/Resources/assets/js/IgniteJS.js b/Resources/assets/js/IgniteJS.js
@@ -0,0 +1,18 @@
+export default class {
+    constructor(url) {
+        this.url = url;
+        this.connected = false;
+    }
+    connect() {
+        this.wsc = new WebSocket(`ws://${this.url}/control`);
+        this.wst = new WebSocket(`ws://${this.url}/telemetry`);
+
+        this.wsc.onopen = () => {
+            this.connected = true;
+            console.log('Ignite Connected')
+        }
+    }
+    sendControlMessage(type, data) {
+        this.wsc.send(`${type}|${data}`);
+    }
+}
diff --git a/Resources/assets/js/components/SideNavFlightsCard.vue b/Resources/assets/js/components/SideNavFlightsCard.vue
@@ -2,7 +2,7 @@
     <div class="flights-card">
         <div class="flights-title">Flights</div>
         <div style="margin: 0 .25rem;">
-            <v-btn block color="primary"><v-icon left>add</v-icon>New Flight</v-btn>
+            <v-btn block color="primary" to="flights/new"><v-icon left>mdi-plus</v-icon>New Flight</v-btn>
         </div>
         <div class="flight-flex-container">
             <div class="flight-button">
@@ -43,12 +43,12 @@
         width: 100%;
         padding: 1rem 0;
         min-height: 50px;
-        background: var(--v-accent-base);
+        background: var(--v-secondary-base);
         text-align: center;
     }
     .flight-button:hover {
         transition: .2s;
         background: var(--v-primary-base);
         cursor: pointer;
     }
-</style>
+</style>
diff --git a/Resources/assets/js/main.js b/Resources/assets/js/main.js
@@ -10,6 +10,8 @@ import App from './App'
 import router from './router'
 import axios from 'axios'
 
+import ignite from './IgniteJS'
+
 let token = document.head.querySelector('meta[name="csrf-token"]');
 
 if (token) {
@@ -20,7 +22,7 @@ if (token) {
 
 
 import 'vuetify/dist/vuetify.min.css'
-
+import '@mdi/font/css/materialdesignicons.css'
 import mainLayout from './views/Layouts/MainLayout'
 import Blank from "./views/Layouts/Blank";
 Vue.component('main-layout', mainLayout);
@@ -33,21 +35,32 @@ const vuetify = new Vuetify({
         dark: true,
         themes: {
             dark: {
-                primary: window.appSettings.colors.primary
+                primary: window.appSettings.colors.primary,
+                secondary: window.appSettings.colors.secondary,
+                accent: window.appSettings.colors.accent,
             }
         },
         options: {
             customProperties: true
         }
     },
+    icons: {
+        iconfont: 'mdi', // 'mdi' || 'mdiSvg' || 'md' || 'fa' || 'fa4' || 'faSvg'
+    },
 });
-
 new Vue({
     router,
     store,
     vuetify,
+    data() {
+        return {
+            ignite: null
+        }
+    },
     created()
     {
+        this.$ignite = new ignite("127.0.0.1:5989");
+        this.$ignite.connect();
         console.log("Application Booted.");
     },
     mounted(){

diff --git a/Resources/assets/js/router/index.js b/Resources/assets/js/router/index.js
@@ -36,7 +36,7 @@ export default new Router({
         { path: '/trips/create', name: 'new_trip', component: FlightListView},
         // User Profiles
         { path: '/profile', redirect: to => {
-            return `/users/${this.$store.state.user.id}`;
+            return `/users/${window.appSettings.user.id}`;
             }},
         { path: '/users/:id', name: 'profile', component: ProfileIndexView},
         { path: '/users/:id/logbook', name: 'profile_logbook', component: ProfileLogbookView},
@@ -45,6 +45,6 @@ export default new Router({
         { path: '/users/:id/hanger/:aircraft', name: 'aircraft_detailed', component: PersonalAircraftDetailedView},
         { path: '/settings', name: 'settings', component: SettingsView},
         { path: '/settings/admin', name: 'settings_admin', component: InterfaceSettingsAdminView},
-        { path: '/map', name: 'map', component: iFrameContainerView, meta: {frameUrl: "https://simvector.cardinalhorizon.com/"}}
+        { path: '/map', name: 'map', component: iFrameContainerView, meta: {frameUrl: "https://simvector.net/engine"}}
     ]
 });
diff --git a/Resources/assets/js/views/Dashboard.vue b/Resources/assets/js/views/Dashboard.vue
@@ -1,15 +1,16 @@
 <template>
     <div>
-        <div style="position: absolute; height: inherit; width: 100%; z-index: 0">
-            <v-img :aspect-ratio="16/5" src="https://i.imgur.com/Fj4dbUx.png" gradient="rgba(100,115,201,.33), rgba(25,32,72,.7)"></v-img>
+        <div style="position: fixed; height: inherit; width: 100%; z-index: 0">
+            <v-img :aspect-ratio="16/9" src="/img/default_background.jpg" gradient="rgba(100,115,201,.33), rgba(25,32,72,.7)"></v-img>
         </div>
-        <div style="position: relative; z-index: 1; padding-top: 20rem">
+        <div style="position: relative; z-index: 1; padding-top: 5rem">
             <v-container grid-list-lg>
+                <img src="/img/SparkFlightOps.svg" height="200px"/>
                 <v-layout grid row>
                     <v-flex lg4 md6 sm12>
                         <v-card class="mx-auto mb-4">
                             <v-img class="white--text align-end" height="150px" src="https://upload.wikimedia.org/wikipedia/commons/2/2c/SLC_airport%2C_2010.jpg"></v-img>
-                            <v-card-title>Welcome Back Taylor!</v-card-title>
+                            <v-card-title>Welcome Back {{ user.first_name }}!</v-card-title>
                             <v-card-subtitle class="pb-0">Currently at <b>Salt Lake City International Airport</b></v-card-subtitle>
                             <v-card-actions>
                                 <v-btn text color="primary">Start Flight Here</v-btn>
@@ -30,7 +31,7 @@
                     <v-flex lg8 md6 sm12>
                         <v-card>
                             <v-responsive :aspect-ratio="16/9">
-                                <iframe style="height: 100%; width: 100%; border: none;" src="https://fsvaos.net/map_dev"></iframe>
+                                <iframe style="height: 100%; width: 100%; border: none;" src="https://simvector.net/engine"></iframe>
                             </v-responsive>
                         </v-card>
                     </v-flex>
@@ -50,7 +51,12 @@
 
 <script>
     export default {
-        name: "Dashboard"
+        name: "Dashboard",
+        computed: {
+            user() {
+                return window.appSettings.user;
+            }
+        }
     }
 </script>
 

diff --git a/Resources/assets/js/views/Flights/NewFlightSelection.vue b/Resources/assets/js/views/Flights/NewFlightSelection.vue
@@ -1,7 +1,29 @@
 <template>
-    <div>
-
-    </div>
+    <v-container grid-list-lg>
+        <v-layout grid row>
+            <v-flex lg4 md6 sm12>
+                <v-card class="mx-auto mb-4">
+                    <v-img class="white--text align-end" height="150px" src="https://upload.wikimedia.org/wikipedia/commons/2/2c/SLC_airport%2C_2010.jpg"></v-img>
+                    <v-card-title>Welcome Back</v-card-title>
+                    <v-card-subtitle class="pb-0">Currently at <b>Salt Lake City International Airport</b></v-card-subtitle>
+                    <v-card-actions>
+                        <v-btn text color="primary">Start Flight Here</v-btn>
+                    </v-card-actions>
+                </v-card>
+                <v-card class="mx-auto">
+                    <v-card-title>Statistics</v-card-title>
+                    <v-list>
+                        <v-list-item>Total Flights: 200</v-list-item>
+                        <v-list-item>Total Hours: 156.2h</v-list-item>
+                        <v-list-item>Total Airports Visited: 27</v-list-item>
+                    </v-list>
+                    <v-card-actions>
+                        <v-btn text color="primary">View Profile</v-btn>
+                    </v-card-actions>
+                </v-card>
+            </v-flex>
+        </v-layout>
+    </v-container>
 </template>
 
 <script>
@@ -11,5 +33,16 @@
 </script>
 
 <style scoped>
-
-</style>
+    .lateral-flex-container {
+        display: flex;
+    }
+    .left-box {
+        width: 100%;
+        background: #6cb2eb;
+    }
+    .right-box {
+        width: 100%;
+        height: 250px;
+        background: #38c172;
+    }
+</style>
diff --git a/Resources/assets/js/views/Layouts/MainLayout.vue b/Resources/assets/js/views/Layouts/MainLayout.vue
@@ -1,44 +1,53 @@
 <template>
     <div>
         <v-navigation-drawer dark app width="300px" v-model="drawer">
-            <v-img :aspect-ratio="16/9" src="/img/vaos_df_bg-01.svg" gradient="rgba(100,115,201,.33), rgba(25,32,72,.7)">
+            <v-img :aspect-ratio="16/9" :src="cover" gradient="rgba(100,100,100,.33), rgba(25,25,25,.7)">
                 <v-layout pa-2 column align-center fill-height class="lightbox white--text">
                     <v-spacer></v-spacer>
-                    <v-avatar size="84">
-                        <img src="https://pbs.twimg.com/profile_images/1151671407228706822/UZxOws2b_400x400.jpg" alt="John" style="border: white 3px solid;">
+                    <v-avatar size="84" style="border: white 3px solid; font-size: 24px;" rounded color="primary">
+                        <img v-if="user.avatar_url" :src="user.avatar_url" alt="John" style="border: white 3px solid;">
+                        <div v-if="!user.avatar_url">{{user.first_name.charAt(0)}}{{user.last_name.charAt(0)}}</div>
                     </v-avatar>
                     <v-flex shrink style="text-align:center">
-                        <div class="headline">Taylor Broad</div>
-                        <div class="subtitle-1">BossOfGames | Senior Captain</div>
+                        <div class="headline">{{user.first_name}} {{user.last_name}}</div>
+                        <div class="subtitle-1">{{user.username}} | Senior Captain</div>
                     </v-flex>
                 </v-layout>
             </v-img>
             <SideNavFlightsCard></SideNavFlightsCard>
             <v-list flat>
                 <v-list-item link to="/">
                     <v-list-item-icon>
-                        <v-icon>dashboard</v-icon>
+                        <v-icon>mdi-view-dashboard</v-icon>
                     </v-list-item-icon>
                     <v-list-item-content>
                         <v-list-item-title>Dashboard</v-list-item-title>
                     </v-list-item-content>
                 </v-list-item>
                 <v-list-item link to="profile">
                     <v-list-item-icon>
-                        <v-icon>person</v-icon>
+                        <v-icon>mdi-account</v-icon>
                     </v-list-item-icon>
                     <v-list-item-content>
                         <v-list-item-title>Profile</v-list-item-title>
                     </v-list-item-content>
                 </v-list-item>
                 <v-list-item link to="map">
                     <v-list-item-icon>
-                        <v-icon>map</v-icon>
+                        <v-icon>mdi-map</v-icon>
                     </v-list-item-icon>
                     <v-list-item-content>
                         <v-list-item-title>Live Map</v-list-item-title>
                     </v-list-item-content>
                 </v-list-item>
+                <v-list-item link to="downloads">
+                    <v-list-item-icon>
+                        <v-icon>mdi-folder-download</v-icon>
+                    </v-list-item-icon>
+                    <v-list-item-content>
+                        <v-list-item-title>Download Center</v-list-item-title>
+                    </v-list-item-content>
+                </v-list-item>
             </v-list>
             <!--
             <template slot="append">
@@ -55,8 +64,8 @@
         <v-content style="min-height: 100vh;">
             <slot></slot>
         </v-content>
-        <v-footer app>
-            VAOS Classic 2.1 | Material Crew Redux
+        <v-footer style="padding: 0" app>
+            <div style="background: #38c172; padding: 0 1rem;"><v-icon>mdi-check</v-icon>Ignite Connected</div>
         </v-footer>
     </div>
 </template>
@@ -71,6 +80,26 @@
             console.log(this.$vuetify.breakpoint.lgAndUp);
             this.drawer = !!this.$vuetify.breakpoint.lgAndUp;
         },
+        computed: {
+            user() {
+                return window.appSettings.user;
+            },
+            cover() {
+                if (this.user.cover_url) {
+                    return this.user.cover_url;
+                } else {
+                    return "/img/default_cover.png";
+                }
+            },
+            ignite_status() {
+                let status = this.$store.ignite.state.status;
+                switch (status) {
+                    case 0: return {text: "Disconnected",icon: "close", classes: {ignite_disconnected: true}}
+                    case 1: return {text: "No Sim Data",icon: "plane", classes: {ignite_nosim: true}}
+                    case 2: return {text: "Connected",icon: "check", classes: {ignite_disconnected: true}}
+                }
+            }
+        },
         data() {
             return {
                 comm_name: window.appSettings.community_name,
@@ -95,5 +124,14 @@
 </script>
 
 <style scoped>
-
+.ignite_connected {
+    background: #38c172;
+}
+.ignite_nosim {
+    background: #ffed4a;
+    color: black;
+}
+.ignite_disconnected {
+    background: #c70000;
+}
 </style>
diff --git a/Resources/assets/js/views/TripPlannerView.vue b/Resources/assets/js/views/TripPlannerView.vue
@@ -0,0 +1,13 @@
+<template>
+
+</template>
+
+<script>
+    export default {
+        name: "TripPlannerView"
+    }
+</script>
+
+<style scoped>
+
+</style>