Code of Conduct support [fixes rauchg#69, thanks @limulus]

Author: rauchg

Procfile

@@ -1 +1 @@
-web: bin/slackin --channels "$SLACK_CHANNELS" --port $PORT $SLACK_SUBDOMAIN $SLACK_API_TOKEN
+web: bin/slackin --coc "$SLACK_COC" --channels "$SLACK_CHANNELS" --port $PORT $SLACK_SUBDOMAIN $SLACK_API_TOKEN

app.json

@@ -13,6 +13,10 @@
       "description": "A Slack API token (find it on https://api.slack.com/web)",
       "required": true
     },
+    "SLACK_COC": {
+      "description": "A URL to a Code of Conduct people must agree on before joining.",
+      "required": false
+    },
     "SLACK_CHANNELS": {
       "description": "Comma-separated list of single guest channels to invite them to (leave blank for a normal, all-channel invite). In order to make this work, you have to have a paid account. You'll only be able to invite as many people as your number of paying members times 5.",
       "required": false

bin/slackin

@@ -14,6 +14,7 @@ program
 .option('-i, --interval <int>', 'How frequently (ms) to poll Slack [$SLACK_INTERVAL or 5000]', process.env.SLACK_INTERVAL || 5000)
 .option('-P, --path', 'Path to serve slackin under', '/')
 .option('-s, --silent', 'Do not print out warns or errors')
+.option('-C, --coc <coc>', 'Full URL to a CoC that needs to be agreed to')
 .option('-c, --css <file>', 'Full URL to a custom CSS file to use on the main page')
 .parse(process.argv);
 

lib/assets/checkbox-checked.svg

@@ -6,6 +6,7 @@ var request = superagent;
 // elements
 var select = body.querySelector('select');
 var input = body.querySelector('input');
+var coc = body.querySelector('input[name=coc]');
 var button = body.querySelector('button');
 
 // remove loading state
@@ -18,7 +19,7 @@ body.addEventListener('submit', function(ev){
   button.className = '';
   button.innerHTML = 'Please Wait';
   var channel = select ? select.value : null;
-  invite(channel, input.value, function(err){
+  invite(channel, coc && coc.checked ? 1 : 0, input.value, function(err){
     if (err) {
       button.removeAttribute('disabled');
       button.className = 'error';
@@ -31,10 +32,11 @@ body.addEventListener('submit', function(ev){
 });
 
 
-function invite(channel, email, fn){
+function invite(channel, coc, email, fn){
   request
   .post(data.path + 'invite')
   .send({
+    coc: coc,
     channel: channel,
     email: email
   })

lib/assets/checkbox.png

@@ -23,6 +23,7 @@ export default function slackin({
   interval = 5000, // jshint ignore:line
   org,
   css,
+  coc,
   path='/',
   channels,
   silent = false // jshint ignore:line
@@ -71,7 +72,7 @@ export default function slackin({
         dom('link rel="shortcut icon" href=https://slack.global.ssl.fastly.net/272a/img/icons/favicon-32.png'),
         css && dom('link rel=stylesheet', { href: css })
       ),
-      splash({ path, css, name, org, logo, channels, active, total })
+      splash({ coc, path, css, name, org, logo, channels, active, total })
     );
     res.type('html');
     res.send(page.toHTML());
@@ -112,6 +113,12 @@ export default function slackin({
       .json({ msg: 'Invalid email' });
     }
 
+    if (coc && '1' != req.body.coc) {
+      return res
+      .status(400)
+      .json({ msg: 'Agreement to CoC is mandatory' });
+    }
+
     invite({ token, org, email, channel: chanId }, err => {
       if (err) {
         return res
@@ -137,7 +144,7 @@ export default function slackin({
     let { name } = slack.org;
     let { active, total } = slack.users;
     if (!name) return res.send(404);
-    let dom = splash({ path, name, channels, active, total, iframe: true });
+    let dom = splash({ coc, path, name, channels, active, total, iframe: true });
     res.type('html');
     res.send(dom.toHTML());
   });

lib/assets/checkbox.svg

@@ -1,7 +1,7 @@
 
 import dom from 'vd';
 
-export default function splash({ path, name, org, logo, active, total, channels, iframe }){
+export default function splash({ path, name, org, coc, logo, active, total, channels, iframe }){
   let div = dom('.splash',
     !iframe && dom('.logos',
       logo && dom('.logo.org'),
@@ -30,6 +30,14 @@ export default function splash({ path, name, org, logo, active, total, channels,
       ),
       dom('input.form-item type=email placeholder=you@yourdomain.com '
         + (!iframe ? 'autofocus' : '')),
+      coc && dom('.coc',
+        dom('label',
+          dom('input type=checkbox name=coc value=1'),
+          'I agree to the ',
+          dom('a', { href: coc, target: '_blank', }, 'Code of Conduct'),
+          '.'
+        )
+      ),
       dom('button.loading', 'Get my Invite')
     ),
     !iframe && dom('p.signin',
@@ -132,6 +140,48 @@ function style({ logo, active, iframe } = {}){
     }
   }
 
+  css.add('.coc', {
+    'font-size': '12px',
+    padding: '15px 0 5px',
+    color: '#666'
+  });
+
+  css.add('.coc label', {
+    cursor: 'pointer'
+  });
+
+  css.add('.coc input', {
+    'appearance': 'none',
+    '-webkit-appearance': 'none',
+    border: 'none',
+    'vertical-align': 'middle',
+    margin: '0 5px 0 0',
+  });
+
+  css.add('.coc input::after', {
+    content: '""',
+    display: 'inline-block',
+    width: '15px',
+    height: '15px',
+    'vertical-align': 'middle',
+    background: 'url(/assets/checkbox.svg)',
+    cursor: 'pointer'
+  });
+
+  css.add('.coc input:checked::after', {
+    'background-position': 'right'
+  });
+
+  css.add('.coc a', {
+    color: '#666'
+  });
+
+  css.add('.coc a:hover', {
+    'background-color': '#666',
+    'text-decoration': 'none',
+    color: '#fff'
+  });
+
   css.add('p', {
     'font-size': iframe ? '12px' : '15px',
     'margin': iframe ? '0 0 5px' : '5px 0'