Add a footer to all the pages.

rpavlik · Jan 26, 2023 · 368cd72 · 368cd72
1 parent ed5ed06
commit 368cd72
Show file tree

Hide file tree

Showing 9 changed files with 48 additions and 0 deletions.
diff --git a/src/client/components/Footer/footer.html b/src/client/components/Footer/footer.html
@@ -0,0 +1,15 @@
+<footer class="footer">
+  <div class="content has-text-centered" v-if="user">
+    Logged in as: {{ user.name }} (@{{ user.username }})
+  </div>
+  <div class="content has-text-centered">
+    User authentication source: {{ userSourceDescription }}
+  </div>
+  <div class="content has-text-centered">
+    <p>
+      <strong>TCQ</strong> is open source software, and was originally developed by <a href="https://github.com/bterlson/tcq">Brian Terlson</a> for <a href="https://github.com/tc39/how-we-work">TC39</a>.
+      This fork is maintained by <a href="https://github.com/rpavlik/tcq">Ryan Pavlik</a> (<a href="https://collabora.com">Collabora</a>) for the use of <a href="https://khronos.org">the Khronos Group</a>.
+      You are welcome and encouraged to <a href="https://github.com/rpavlik/tcq">get the source and contribute</a>.
+    </p>
+  </div>
+</footer>
diff --git a/src/client/components/Footer/footer.scss b/src/client/components/Footer/footer.scss
@@ -0,0 +1 @@
+@import '~bulma';
diff --git a/src/client/components/Footer/footer.ts b/src/client/components/Footer/footer.ts
@@ -0,0 +1,18 @@
+import Vue from 'vue';
+import './footer.scss';
+import template from './footer.html';
+
+const Footer = template(
+  Vue.extend({
+    props: {
+      user: undefined,
+      userSourceDescription: undefined,
+    },
+    created() {
+      this.userSourceDescription = (window as any).userSourceDescription;
+      this.user = (window as any).user;
+    },
+  })
+);
+
+export default Footer;
diff --git a/src/client/pages/home/home.html b/src/client/pages/home/home.html
@@ -2,6 +2,7 @@
 <html>
 <head>
   <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>TCQ Speaker Queue - Home</title>
   <!--
   <script>
     var appInsights=window.appInsights||function(config){
@@ -60,5 +61,6 @@ <h1 class="title">Well let me finish! As I was going to say... TCQ helps:</h1>
         to get started!</a>
     </div>
   </section>
+  <footer></footer>
 </body>
 </html>
diff --git a/src/client/pages/home/home.ts b/src/client/pages/home/home.ts
@@ -1 +1,4 @@
+import Footer from '../../components/Footer/footer';
 import './home.scss';
+
+new Footer({ el: 'footer' });
diff --git a/src/client/pages/meeting/meeting.html b/src/client/pages/meeting/meeting.html
@@ -3,6 +3,7 @@
 
 <head>
   <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>TCQ Speaker Queue - Meeting</title>
   <!--
   <script>
     var appInsights=window.appInsights||function(config){
@@ -21,6 +22,7 @@
   <div id="app">
 
   </div>
+  <footer></footer>
 </body>
 
 </html>
diff --git a/src/client/pages/meeting/meeting.ts b/src/client/pages/meeting/meeting.ts
@@ -1,4 +1,7 @@
 import App from '../../components/App/app';
+import Footer from '../../components/Footer/footer';
 import './meeting.scss';
+
 // apply template
 new App({ el: '#app' });
+new Footer({ el: 'footer' });
diff --git a/src/client/pages/new/new.html b/src/client/pages/new/new.html
@@ -3,6 +3,7 @@
 
 <head>
   <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>TCQ Speaker Queue - Welcome</title>
   <!--
   <script>
     var appInsights=window.appInsights||function(config){
@@ -42,5 +43,6 @@
       </div>
     </div>
   </section>
+  <footer></footer>
 </body>
 </html>
diff --git a/src/client/pages/new/new.ts b/src/client/pages/new/new.ts
@@ -2,6 +2,8 @@ import Vue from 'vue';
 import './new.scss';
 import { NewMeeting } from '../../components/NewMeeting/NewMeeting';
 import { JoinMeeting } from '../../components/JoinMeeting/JoinMeeting';
+import Footer from '../../components/Footer/footer';
 
 new NewMeeting({ el: '#new-meeting' });
 new JoinMeeting({ el: '#join-meeting' });
+new Footer({ el: 'footer' });