Render template of teams and meetings data from yaml file

mote/config.py

@@ -2,3 +2,4 @@
 MEETBOT_URL = "https://meetbot-raw.fedoraproject.org"
 DATAGREPPER_BASE_URL = "https://apps.fedoraproject.org"
 RECOGNIITION_PATTERN = r"(.*)[\-\.]([0-9]{4}-[0-9]{2}-[0-9]{2})-([0-9]{2}\.[0-9]{2})"
+TEAMS_FILE_LOCATION = "src/mote/teams.yml"

mote/main.py

@@ -21,10 +21,12 @@
 """
 
 import logging
+import os
 import re
 from datetime import datetime
 
 import click
+import yaml
 from fedora_messaging import api
 from flask import Flask, abort, jsonify, render_template, request
 from flask_socketio import SocketIO
@@ -215,5 +217,17 @@ def page_not_found(error):
     return render_template("e404page.html"), 404
 
 
+@main.get("/teams")
+def teamspage():
+    path = os.path.abspath(main.config["TEAMS_FILE_LOCATION"])
+    data = dict()
+    with open(path, "r") as stream:
+        try:
+            data = yaml.safe_load(stream)
+        except yaml.YAMLError as exc:
+            logging.error(exc)
+    return render_template("teams.html", teamdata=data)
+
+
 if __name__ == "__main__":
     socketio.run(mainfunc())

mote/static/css3/fragment.css

@@ -138,4 +138,54 @@ hr {
 */
 [name^="l-"]:target + .tm, [name^="l-"]:target + .tm + .nk, [name^="l-"]:target + .tm + .nka {
     background-color: #66b3b3;
-}
+}
+
+#bigcard {
+    border: solid transparent;
+}
+
+.card li {
+    color: rgba(60, 110, 180, 1);
+    font-family: 'Montserrat';
+    font-weight: bold;
+}
+
+.card header {
+    font-family: 'Montserrat';
+    font-weight: bold;
+}
+
+.card label {
+    margin-right: auto;
+    color: rgba(81, 162, 218, 1);
+    font-family: 'Montserrat';
+}
+
+.checkbox {
+    color: rgba(81, 162, 218, 1);
+    font-family: 'Montserrat';
+    font-style: 'normal';
+    font-size: 22px;
+    font-weight: bold;
+}
+
+.table {
+    margin-bottom: 0px;
+}
+
+text {
+    color: rgba(81, 162, 218, 1);
+    font-family: 'Open Sans';
+    font-size: 12px;
+}
+
+.item {
+    color: rgba(60, 110, 180, 1);
+    font-family: 'Open Sans';
+    font-style: 'normal';
+    font-size: 18px;
+    font-weight: bold;
+    letter-spacing: 0px;
+    text-decoration: none;
+    text-transform: none;
+}

mote/teams.yml

@@ -0,0 +1,70 @@
+Ansible Team:
+    - Documentation Working Group aka DaWGs Meeting
+    - Ansible Community Meeting
+    - ansible-conf Contributor Summit Day 1 Meeting
+    - ansbile_core_irc_public_meeting
+    - ansible_contributor_experience_working_group_meeting
+    - ansible_cwg_sprint_meeting
+    - ansible_dev_meeting
+APAC Ambasssadors(Asia-Pacific):
+    - APAC Ambassador's bi-weekly meeting
+    - apac team meeting
+EMEA Ambassadors(Europe, MIddle East and Africa):
+    - emea_ambassadors team meeting
+Extra Packages for Enterprise Linux(EPEL):
+    - epel meeting
+Fedora Apps and Websites Team:
+    - PDC and Fedora Meeting
+    - CPE Infra/RelEng daily Standup Meeting
+    - AskBot Summer updates Meeting
+    - FAS3 discussion Meeting
+    - Hackfest deliverables Meeting
+    - justatest Meeting 
+    - Fedora Websites Meeting
+Fedora Badges Team:
+    - badges team meeting
+    - Fedora Badges Bug Triage Session 
+Fedora Community Operations(CommOps):
+    - Fedora CommOps Meeting
+    - commops_hack_session_meeting
+    - community_openshift_retrospective and planning   
+Fedora Design Team:
+    - fedora-design team meeting        
+Fedora Diversity & Inclusion Team:
+    - Fedora Diversity Meeting
+Fedora Documentation Team:
+    - Fedora Docs Project Meeting
+    - Testing Meeting
+    - Fedora Docs Office Hours Meeting
+    - Laura's office hours Meeting
+Fedora Engineering Steering Committee(FESCo):
+    - fesco team meeting
+Fedora Globalization (G11n) Team:
+    - g11n team meeting
+Fedora Infrastructure Team:
+    - Fedora Infrastructure Ops Daily Standup Meeting
+    - infrastructure team meeting
+Fedora Internationalization(i18n) Team:
+    - i18n team meeting
+Fedora Magazine Editorial Board:
+    - magazine team meeting
+    - Fedora Magazine weekly meeting
+Fedora Marketing Team:
+    - fedora-mktg team meeting
+    - test meeting
+    - Fedora Insight meeting
+Fedora Packaging Committee(FPC):
+    - fpc team meeting
+Fedora Quality Assurance(QA):
+    - fedora-qa team meeting
+    - Special Fedora QA Wireplumber Meeting
+Fedora Release Engineering(releng):
+    - releng team meeting
+Fedora Zhongwen User Group(FZUG):
+    - fzug team meeting
+LATAM Ambassadors(Latin America) Group:
+    - fedora_latam_ambassadors_meeting
+NA Ambassadors(North America):
+    - famna team meeting
+Project Leadership Team:
+    - fedora_council team meeting

mote/templates/mainpage.html

@@ -58,7 +58,7 @@
                             </a>
                         </li>
                         <li class="nav-item">
-                            <a class="nav-link" type="button" href="#">
+                            <a class="nav-link" type="button" href="/teams">
                                 Meetings by Group
                             </a>
                         </li>

mote/templates/teams.html

@@ -36,7 +36,6 @@
     <script src="{{ url_for('static', filename='jscn/easy.qrcode.min.js') }}"></script>
     <script src="{{ url_for('static', filename='jscn/socket.io.js') }}"></script>
     <script src="{{ url_for('static', filename='jscn/fullcalendar.js') }}"></script>
-    <link href="{{ url_for('static', filename='css3/teams.css') }}" rel="stylesheet" />
     <title>Meetbot Logs</title>
 </head>
 
@@ -65,7 +64,7 @@
                         </a>
                     </li>
                     <li class="nav-item">
-                        <a class="nav-link" type="button" href="#">
+                        <a class="nav-link" type="button" href="">
                             Meetings by Group
                         </a>
                     </li>
@@ -92,16 +91,20 @@
     <div class="container-lg">
         <div class="card mt-1" id="bigcard">
             <div class="card-body pt-0">
-                <article>
-                        <i class="fa fa-users" aria-hidden="true"></i>
-                        Meetings by Group
-                        <input class="form-check-input" type="checkbox">
-                        Hide inactive
-                    </article>
+                <div class="mt-4">
+                    <br><br>
+                    <div class="checkbox">
+                        <div class="d-flex justify-content-between">
+                        <div><i class="fa fa-users" aria-hidden="true"></i> Meetings by Group</div>
+                        <div><input class="form-check-input" type="checkbox"> Hide inactive</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
                     <br><br>
                     <div class="card">
                         <div class="card-header">
-                            23 Groups
+                            {{ teamdata|length }} Groups
                         </div>
                         <table class="table">
                             <tbody>
@@ -114,8 +117,8 @@
                                         </item>
                                         <div class="btn-group" role="group"
                                             aria-label="Basic checkbox toggle button group">
-                                            <input type="checkbox" class="btn-check" id="btncheck1" autocomplete="off">
-                                            <label class="btn btn-outline-primary" for="btncheck1"><i
+                                            <input type="checkbox" class="btn-check" autocomplete="off">
+                                            <label class="btn btn-outline-primary" ><i
                                                     class="far fa-calendar-alt"></i> 15 Nov 2021</label>
                                         </div>
                                     </td>
@@ -305,74 +308,7 @@
     $('body').on('click', function (e) {
         document.getElementById('dropdown').classList.remove("show")
     });
-    var allEvents = []
-    async function getMonthlyMeetings() {
-        const d = new Date();
-        let day = d.getDate();
-        await $.getJSON("/fragedpt/", {
-            "rqstdata": "clndrmtgs",
-            "numdays": day
-        }, function (data) {
-            for (var name in data) {
-                var dictionary = {}
-                dictionary.title = data[name].topic
-                dictionary.start = new Date(data[name].time).toISOString().slice(0, 10);
-                dictionary.url = data[name].slug.summary
-                dictionary.backgroundColor = '#3C6EB4'
-                allEvents.push(dictionary)
-            }
-        });
-    }
 
-    document.addEventListener('DOMContentLoaded', async function () {
-        var calendarEl = document.getElementById('calendar');
-        var calendar = new FullCalendar.Calendar(calendarEl, {
-            initialView: 'dayGridWeek',
-            handleWindowResize: true,
-            windowResize: function (arg) {
-                calendar.setOption('height', window.innerHeight - 170);
-            },
-            customButtons: {
-                monthView: {
-                    text: 'Month',
-                    click: function () {
-                        calendar.changeView('dayGridMonth');
-                        document.querySelector('[title="Previous month"]').disabled = true
-                        document.querySelector('[title="Next month"]').disabled = true
-                    }
-                },
-                weekView: {
-                    text: 'Week',
-                    click: function () {
-                        calendar.changeView('dayGridWeek');
-                        document.querySelector('[title="Previous week"]').disabled = false
-                        document.querySelector('[title="Next week"]').disabled = false
-                    }
-                }
-            },
-            fixedWeekCount: false,
-            height: window.innerHeight - 150,
-            headerToolbar: {
-                center: 'monthView,weekView'
-            },
-            views: {
-                dayGridWeek: {
-                    headerToolbar: false
-                }
-            }
-        });
-        calendar.render();
-        document.getElementById("loader").innerHTML = `
-        <a class="nav-link active" aria-current="page" type="button">Loading meetings...</a>
-        `;
-        await getMonthlyMeetings();
-        document.getElementById("loader").innerHTML = `
-        <a class="nav-link active" aria-current="page" type="button">Recent meetings</a>
-        `;
-        for (var i = 0; i < allEvents.length; i++) {
-            calendar.addEvent(allEvents[i])
-        }
-    });
 </script>
 
 </html>