Allow setting default view

src/components/Toolbar.vue

@@ -41,6 +41,17 @@
               </v-list-tile-content>
             </v-list-tile>
 
+            <v-list-tile>
+              <v-list-tile-content class='mt-4' style='height: 75px'>
+                <v-select v-model='defaultView' label='Default View'
+                  :items='[
+                  {text: "Rooms", value: "rooms"},
+                  {text: "Full", value: "agenda"},
+                  {text: "Events", value: "events"}]'>
+                </v-select>
+              </v-list-tile-content>
+            </v-list-tile>
+
             <v-list-tile href='/admin/' v-if='isAdmin'>
               <v-list-tile-content>
                 <v-list-tile-title>Go To Admin Panel</v-list-tile-title>
@@ -83,16 +94,18 @@ export default class Toolbar extends Vue {
   @Prop(Boolean) public value!: boolean;
   @Action('auth/login') public login!: () => void;
   @Action('auth/logout') public logout!: () => void;
-  @Action('auth/renewAuth') public renewAuth!: () => void;
+  @Action('auth/renewAuth') public renewAuth!: () => Promise<void>;
   @Action('auth/unsubscribe') public unsubscribe!: (sub: PushSubscription) => void;
   @Action('auth/updateSubscription') public updateSubscription!: (sub: PushSubscription) => void;
+  @Action('auth/setDefaultView') public setDefaultView!: (view: string) => Promise<void>;
   @Getter('auth/authenticated') public authenticated!: boolean;
   @Getter('auth/authflag') public authflag!: boolean;
   @Getter('auth/avatar') public avatar!: string;
   @Getter('auth/username') public username!: string;
   @Getter('auth/nickname') public nickname!: string;
   @Getter('auth/admin') public isAdmin!: boolean;
   @Getter('curSchedule') public curSchedule!: Schedule;
+  @Getter('auth/defview') public defView!: string;
 
   public readonly color = process.env.VUE_APP_TOOLBAR_COLOR;
   public readonly btncolor = process.env.VUE_APP_LOGIN_COLOR;
@@ -103,9 +116,13 @@ export default class Toolbar extends Vue {
   public notifsEnabled = false;
   public swReg: ServiceWorkerRegistration | null = null;
 
-  public created() {
+  public async created() {
     if (this.authflag) {
-      this.renewAuth();
+      await this.renewAuth();
+    }
+
+    if (this.$route.name === 'landing') {
+      this.$router.push({name: this.defaultView, params: this.$route.params});
     }
 
     this.notifPermission = (Notification.permission === 'granted');
@@ -121,6 +138,15 @@ export default class Toolbar extends Vue {
     this.notifsEnabled = (sub !== null);
   }
 
+  public get defaultView(): string {
+    return this.defView;
+  }
+
+  public set defaultView(val: string) {
+    this.setDefaultView(val);
+    this.$ga.event('prefs', 'change def view', val);
+  }
+
   @Watch('notifsEnabled')
   public async toggleNotifications(val: boolean, oldVal: boolean) {
     if (val && !this.notifPermission) {

src/router.ts

@@ -8,7 +8,9 @@ const router = new VueRouter({
   mode: 'history',
   base: process.env.BASE_URL,
   routes: [
-    { path: '/', redirect: '/rooms' },
+    {
+      path: '/', name: 'landing',
+    },
     {
       path: '/rooms/:id?', name: 'rooms',
       props,

src/store/authmod.ts

@@ -20,6 +20,7 @@ const authModule: Module<AuthState, RootState> = {
     idToken: localStorage.getItem('id_token'),
     expiresAt: Number(localStorage.getItem('expires_at')) || 0,
     user: JSON.parse(localStorage.getItem('user') || '{}'),
+    defaultView: 'rooms',
   },
   getters: {
     accessToken(state: AuthState): string {
@@ -52,6 +53,12 @@ const authModule: Module<AuthState, RootState> = {
     useremail(state: AuthState): string {
       return state.user ? state.user.email || '' : '';
     },
+    defview(state: AuthState): string {
+      if (state.authenticated && state.user && state.user[auth.NAMESPACE + 'defaultView']) {
+        return state.user[auth.NAMESPACE + 'defaultView'];
+      }
+      return state.defaultView;
+    },
   },
   mutations: {
     authenticated(state: AuthState, authData: Auth0DecodedHash) {
@@ -70,6 +77,7 @@ const authModule: Module<AuthState, RootState> = {
       state.authenticated = false;
       state.accessToken = null;
       state.idToken = null;
+      state.defaultView = 'rooms';
 
       localStorage.removeItem('access_token');
       localStorage.removeItem('id_token');
@@ -81,6 +89,12 @@ const authModule: Module<AuthState, RootState> = {
         state.user[auth.NAMESPACE + 'favs'] = favs;
       }
     },
+    setDefaultView(state: AuthState, view: string) {
+      if (state.user) {
+        state.user[auth.NAMESPACE + 'defaultView'] = view;
+        localStorage.setItem('user', JSON.stringify(state.user));
+      }
+    },
   },
   actions: {
     login() {
@@ -119,6 +133,16 @@ const authModule: Module<AuthState, RootState> = {
         commit('logError', err, { root: true });
       });
     },
+    setDefaultView({ commit, state }, view: string) {
+      if (!state.user) { return; }
+
+      auth.updateUserMeta(state.accessToken || '', state.user.sub || '', {defaultView: view}).then((prof) => {
+        if (!prof) { return; }
+        commit('setDefaultView', prof.user_metadata.defaultView);
+      }).catch((err) => {
+        commit('logError', err, { root: true });
+      });
+    },
     async makeAuthedRequest({ state, dispatch }, payload: AuthPayload) {
       if (!state.user || (payload.attempts && payload.attempts > 2)) { return; }
 

src/store/states.ts

@@ -16,6 +16,7 @@ export interface AuthState {
   idToken: string | null;
   expiresAt: number;
   user: (Auth0UserProfile & {[index: string]: any}) | null;
+  defaultView: string;
 }
 
 export interface RootState {

src/views/Landing.vue

@@ -0,0 +1,18 @@
+<template>
+</template>
+
+<script lang='ts'>
+import { Component, Vue } from 'vue-property-decorator';
+import { Getter, Action } from 'vuex-class';
+
+@Component
+export default class Landing extends Vue {
+  @Getter('auth/authflag') public authflag!: boolean;
+  @Getter('auth/defview') public defView!: string;
+  @Action('auth/renewAuth') public renewAuth!: () => Promise<void>;
+
+  public async created() {
+
+  }
+}
+</script>

src/views/RoomGrid.vue

@@ -3,7 +3,8 @@
     <v-layout column>
       <v-flex align-self-center>
         <v-btn-toggle v-model='dayIdx'>
-          <v-btn flat v-for='(d, idx) in dateRange' :value='idx' :key='idx'>
+          <v-btn flat v-for='(d, idx) in dateRange' :value='idx' :key='idx'
+            @click='$ga.event("events","set room day", d.format("dddd"))'>
             {{ d.format('dddd') }}
           </v-btn>
         </v-btn-toggle>
@@ -22,7 +23,7 @@
 </template>
 
 <script lang='ts'>
-import { Component, Vue, Mixins } from 'vue-property-decorator';
+import { Component, Vue, Mixins, Watch } from 'vue-property-decorator';
 import TimeGrid from '@/components/TimeGrid.vue';
 import ScheduleView from '@/components/Schedule.vue';
 import GridMixin from '@/mixins/grid-mixin';
@@ -39,6 +40,18 @@ import moment from 'moment';
 export default class RoomGrid extends Mixins(GridMixin) {
   public dayIdx = 0;
 
+  @Watch('dateRange')
+  public initDay(val: moment.Moment[]) {
+    if (!val) { return; }
+
+    const today = moment();
+    val.forEach((date, idx) => {
+      if (today.dayOfYear() === date.dayOfYear()) {
+        this.dayIdx = idx;
+      }
+    });
+  }
+
   public get times(): string[] {
     if (!this.sched || !this.roomCols.length) { return []; }