Add review club

docs/.vuepress/components/IRCWRAPPER.vue

@@ -0,0 +1,125 @@
+<template>
+  <div class="irc-logs" v-html="logs"></div>
+</template>
+
+<script>
+import he from 'he';
+
+export default {
+  name: 'IRCWRAPPER',
+  data() {
+    return {
+      logs: "",
+    }
+  },  
+  methods: {
+    parseLogs(content) {
+
+      const URI_SCHEMES = ['http', 'https'];
+      const TRAILING = /[^\/[:^punct:]]+$/;
+      const HH_MM = /^([0-1][0-9]|[2][0-3]):[0-5][0-9] .*/;
+      const IRC_NICK = /^(?:\s*)(<.+?>)/;
+      const LT_GT = /[<>]/g;
+      const LINE_DIGITS = 3;
+      const TIME_SIZE = 'HH:MM'.length;
+      const TIME_SIZE_PLUS_1 = TIME_SIZE + 1;
+      const NON_BREAKING_SPACE = '&nbsp;';
+      const COLORS = ['brown', 'goldenrod', 'cadetblue', 'chocolate', 'cornflowerblue', 'coral', 'crimson', 'forestgreen', 'darkblue', 'firebrick', 'blue', 'green', 'grey', 'hotpink', 'indianred', 'indigo', 'blueviolet', 'maroon', 'mediumblue', 'mediumpurple', 'mediumseagreen', 'navy', 'fuchsia', 'olive', 'orchid', 'purple', 'red', 'seagreen', 'sienna', 'orange', 'slateblue', 'peru', 'salmon', 'teal', 'magenta', 'steelblue', 'rebeccapurple', 'tomato', 'violet', 'darkcyan'];
+      const NUM_COLORS = COLORS.length;
+
+      let lines = content.split("\n");
+      let outputHtml = "";
+      let colors = {};
+      let colorIndex = 0;
+
+      for (let i = 0; i < lines.length; i++) {
+        if ( lines[i].length == 0 ) {
+          break;
+        }
+        const lineno = `${NON_BREAKING_SPACE.repeat(LINE_DIGITS - i.toString().length)}${i}`;
+        const time = lines[i].slice(0, TIME_SIZE);
+        const nameMatch = lines[i].slice(TIME_SIZE_PLUS_1).match(IRC_NICK);
+        const name = nameMatch ? nameMatch[0] : '';
+        let nick = name.replaceAll(LT_GT, '').trim();
+        const color = colors[nick] || ((colorIndex += 1) % NUM_COLORS, colors[nick] = COLORS[colorIndex]);
+        nick = nick === '' ? nick : `&lt;${nick}&gt;`;
+        let message = he.escape(lines[i].slice(TIME_SIZE_PLUS_1 + name.length));
+
+        let urls = message.match(URI_SCHEMES);
+        if (urls != null) {
+          urls.forEach((uri) => {
+            const link = uri.replace(TRAILING, '');
+            message = message.replace(link, `<a href='${link}' target='blank'>${link}</a>`);
+          });
+        }
+
+        outputHtml += `<table class='log-line' id='l-${i}'>
+                  <tr class='log-row'>
+                    <td class='log-lineno'><a class="lineno" href='#l-${i}'>${lineno}</a></td>
+                    <td class='log-time'>${time}</td>
+                    <td>
+                      <span class='log-nick' style='color:${color}'>${nick}</span>
+                      <span class='log-msg'>${message}</span>
+                    </td>
+                  </tr>
+                </table>`;
+      }
+
+      return outputHtml;
+
+    }
+  },
+  mounted() {
+    let content = this.$slots.default[0].children[0].text;
+    let parsedLogs = this.parseLogs(content);
+    this.logs = parsedLogs;
+  }
+};
+</script>
+
+<style scoped>
+.log-time{
+  color: #0000f0;
+  padding-left: 6px;
+  padding-right: 6px;
+}
+
+.log-nick {
+  font-weight: bold;
+  color: green;
+}
+
+.log-msg {
+  padding-left: 0px;
+  white-space: pre-wrap;
+}
+
+.log-line {
+  margin-block-start: 0px;
+  margin-block-end: 0px;
+  font-family: monospace;
+  border-spacing: 0px;
+}
+
+.log-row {
+  vertical-align: top;
+}
+
+td.log-lineno {
+  background-color: #f0f0f0;
+}
+
+th, td {
+  border: none;
+  padding: 0px;
+}
+
+table.log-line {
+  border-collapse: separate;
+}
+
+a.lineno {
+  text-decoration: none;
+}
+
+</style>

docs/.vuepress/components/ReviewClubHeader.vue

@@ -0,0 +1,58 @@
+<template>
+    <header>
+        <div class="logo">
+            <a href="/review-club">BitcoinDevKit PR Review Club</a>
+        </div>
+        <nav>
+            |<span v-for="nav in navs">
+            <a :href="nav.link" class="nav-link">
+                {{ nav.name }}
+            </a> |</span>
+        </nav>
+    </header>
+</template>
+
+
+<script>
+export default {
+    name: "ReviewClubHeader",
+    data() {
+        return {
+            navs: [{name: "ReviewClub Home", link: "/review-club/"}, {name: "BitcoinDevKit Home", link: "/"}, {name: "Meetings", link: "/review-club/meetings/"}, {name: "Code of Conduct", link: "/review-club/code-of-conduct/"}, {name: "Hosting", link: "/review-club/hosting/"}],
+        }
+    }
+}
+</script>
+
+<style scoped>
+header {
+    font-family: "Helvetica",sans-serif;
+    line-height: 1.5;
+}
+
+.logo {
+    text-decoration: none;
+    font-weight: bold;
+    font-size: 48px;
+}
+
+.logo a:link, .logo a:visited {
+    color: #000;
+
+}
+
+a.nav-link {
+    display: inline-block;
+    margin-left: 5px;
+    color: #0000f0;
+    text-decoration: underline;
+}
+
+a.nav-link:visited {
+    color: #551b8c;
+}
+
+a.nav-link:hover {
+    color: #fcc603;
+}
+</style>

docs/.vuepress/components/ReviewClubLayout.vue

@@ -0,0 +1,84 @@
+<template>
+  <div class="container">
+    <div class="header-container">
+      <ReviewClubHeader />
+    </div>
+    <div class="body-container">
+      <Content/>
+    </div>
+  </div>
+</template>
+
+<script>
+import ReviewClubHeader from "./ReviewClubHeader.vue";
+
+export default {
+  data() {
+    return {
+
+    }
+  },
+  components: {
+    ReviewClubHeader
+  },
+}
+</script>
+
+<style scoped>
+.body-container {
+  color: #000;
+  box-sizing: border-box;
+  display: flex;
+  margin-left: 10%;
+  margin-right: 10%;
+  font-family: "Helvetica",sans-serif;
+  line-height: 1.5;
+}
+
+.header-container {
+  color: #000;
+  box-sizing: border-box;
+  display: flex;
+  margin-left: 10%;
+  margin-right: 10%;
+  font-family: "Helvetica",sans-serif;
+  line-height: 1.5;
+}
+
+.body-container .question {
+  font-weight: bold;
+
+}
+
+.body-container a:link {
+  color: #0000f0;
+}
+
+.body-container a:visited {
+  color: #551b8c;
+}
+
+.body-container a {
+  text-decoration: underline;
+}
+
+.meeting-list-container .meeting-list {
+    list-style-type: none;
+}
+
+#meeting-link {
+    color: #0000f0;
+}
+
+#meeting-link:hover {
+    color: #fcc603;
+}
+
+#meeting-link:visited {
+    color: #551b8c;
+}
+
+#text-separator {
+    font-weight: bold;
+}
+</style>

docs/.vuepress/components/ReviewClubMeetingHeader.vue

@@ -0,0 +1,31 @@
+<template>
+    <div class="meeting-header">
+        <p class="date">{{ date| formatDate }}</p>
+        <p class="pr"><a :href="pr">{{ pr }}</a></p>
+        <div class="people-container">
+            <span class="host">Host: {{ host }} <a :href="`https://github.com/${host}`"><i class="fab fa-github"></i></a></span> -
+            <span class="authors">PR Authors: <span class="author" v-for="author in authors">{{ author }} <a :href="`https://github.com/${author}`"><i class="fab fa-github"></i></a></span></span>
+        </div>
+        <p>The PR branch HEAD was <a :href="commitLink">{{ commit }}</a> at the time of this review club meeting.</p>
+    </div>
+</template>
+
+
+<script>
+export default {
+    name: "ReviewClubMeetingHeader",
+    props: {
+        host: String,
+        authors: Array,
+        pr: String,
+        date: String,
+        commit: String,
+        commitLink: String
+    },
+
+}
+</script>
+
+<style>
+@import 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css';
+</style>

docs/.vuepress/components/ReviewClubMeetingLayout.vue

@@ -0,0 +1,64 @@
+<template>
+  <div class="container">
+    <div class="header-container">
+      <ReviewClubHeader />
+    </div>
+    <div class="body-container">
+      <Content/>
+    </div>
+  </div>
+</template>
+
+<script>
+import ReviewClubHeader from "./ReviewClubHeader.vue";
+
+export default {
+  data() {
+    return {
+
+    }
+  },
+  components: {
+    ReviewClubHeader
+  },
+}
+</script>
+
+<style scoped>
+.body-container {
+  color: #000;
+  box-sizing: border-box;
+  display: flex;
+  margin-left: 10%;
+  margin-right: 10%;
+  font-family: "Helvetica",sans-serif;
+  line-height: 1.5;
+}
+
+.header-container {
+  color: #000;
+  box-sizing: border-box;
+  display: flex;
+  margin-left: 10%;
+  margin-right: 10%;
+  font-family: "Helvetica",sans-serif;
+  line-height: 1.5;
+}
+
+.body-container .question {
+  font-weight: bold;
+
+}
+
+.body-container a:link {
+  color: #0000f0;
+}
+
+.body-container a:visited {
+  color: #551b8c;
+}
+
+.body-container a {
+  text-decoration: underline;
+}
+</style>

docs/.vuepress/config.js

@@ -106,6 +106,10 @@ module.exports = {
         text: 'Blog',
         link: '/blog/'
       },
+      {
+        text: 'Review Club',
+        link: '/review-club/'
+      },
       {
         text: 'Discord',
         link: discordUrl