Toolchain/Dependency Upgrade (#418)

* Upgrade to heroku-20 stack

* Move some gulp deps to dev rather than prod

* npm upgrade

* Fix audit time check in asset audit test

* Attempt at parallelising tests where possible

* Add basic calendar button test

Mainly to pickup on FullCalendar loading errors

* Upgrade python deps

* Tends to help if I push valid yaml

* You valid now?

* Fix whoops in requirements.txt

* Change python ver

* Define service in coveralls task

* Run parallelised RIGS tests as one matrix job

* Update python version in tests

* Cache python dependencies

Should majorly speedup parallelillelelised testing

* Purge old vagrant config

* No Ruby compass bodge, no need for rubocop!

* Purge old .idea config

* Switch to gh-a artifact uploading instead of imgur 'hack'

For test failure screenshots. Happy now @mattysmith22? ;p

* Oops, remove unused import

* Exclude tests from the coverage stats

Seems to be artifically deflating our stats

* Refactor asset audit tests with better selectors

Also fixed a silly title error with the modal

* Add title checking to the slightly insane assets test

* Fix unauth test to not just immediately pass out

* Upload failure screenshots as individual artifacts not a zip

Turns out I can't unzip things from my phone, which is a pain

* Should fix asset test on CI

* What about this?

* What about this?

Swear I spend my life jiggerypokerying the damn test suite...

* Does this help the coverage be less weird?

* Revert "Does this help the coverage be less weird?"

This reverts commit 39ab9df836.

* Use pytest as our test runner for better parallelism

Also rewrote some asset tests to be in the pytest style. May do some more. Some warnings cleaned up in the process.

* Bah, codestyle

* Oops, remove obsolete if check

* Fix screenshot uploading on CI (again)

* Try this way of parallel coverage

* Add codeclimate maintainability badge

* Remove some unused gulp dependencies

* Run asset building serverside

* Still helps if I commit valid YAML

* See below

* Different approach to CI dependencies

* Exclude node_modules from codestyle

* Does this work?

* Parallel parallel builds were giving me a headache, try this

* Update codeclimate settings, purge some config files

* Well the YAML was *syntactically* valid....

* Switch back to old coveralls method

* Fix codeclimate config, mark 2

* Attempt to bodge asset test

* Oops, again

Probably bedtime..

* Might fix heroku building

* Attempt #2 at fixing heroku

* Belt and braces approach to coverage

* Github, you need a Actions YAML validator!

* Might fix actions?

* Try ignoring some third party deprecation warnings

* Another go at making coverage show up

* Some template cleanup

* Minor python cleanup

* Import optimisation

* Revert "Minor python cleanup"

This reverts commit 6a4620a2e5.

* Add format arg to coverage command

* Ignore test directories from Heroku slug

* Maybe this works to purge deps postbuild

* Bunch of test refactoring

* Restore signals import, screw you import optimisation

* Further template refactoring

* Add support for running tests with geckodriver, do this on CI

* Screw you codestyle

* Disable firefox tests for now

That was way more errors than I expected

* Run cleanup script from the right location

* Plausibly fix tests

* Helps if I don't delete the pipeline folder prior to collectstatic

* Enable whitenoise

* Can I delete pipeline here?

* Allow seconds difference in assert_times_equal

* Disable codeclimate

* Remove not working rm command

* Maybe this fixes coverage?

* Try different coverage reporter

* Fix search_help to need login

* Made versioning magic a bit less expansive

We have more apps than I thought...

* Fix IDI0T error in Assets URLS

* Refactor 'no access to unauthed' test to cover all of PyRIGS

* Add RAs/Checklists to sample data generator

* Fix some HTML errors in templates

Which apparently only Django's HTML parser cares about, browsers DGAF...

* Port title test to project level

* Fix more HTML

* Fix cable type detail

pipeline/source_assets/js/autocompleter.js

@@ -0,0 +1,102 @@
+function changeSelectedValue(obj,pk,text,update_url) { //Pass in JQuery object and new parameters
+    //console.log('Changing selected value');
+    obj.find('option').remove();  //Remove all the available options
+    obj.append(  //Add the new option
+    	$("<option></option>")
+	    .attr("value",pk)
+	    .text(text)
+	    .data('update_url',update_url)
+	    );
+    obj.selectpicker('render'); //Re-render the UI
+    obj.selectpicker('refresh'); //Re-render the UI
+    obj.selectpicker('val', pk); //Set the new value to be selected
+    obj.change(); //Trigger the change function manually
+}
+
+function refreshUpdateHref(obj) {
+    //console.log('Refreshing Update URL');
+    targetObject = $('#'+obj.attr('id')+'-update');
+    update_url = $('option:selected', obj).data('update_url');
+
+    if (update_url=="") {  //Probably "clear selection" has been chosen
+        //console.log('Trying to disable');
+        targetObject.removeAttr('href');
+	    targetObject.addClass('disabled');
+    } else {
+	    targetObject.prop('href', update_url);
+	    targetObject.removeClass('disabled');
+    }
+}
+
+function initPicker(obj) {
+	var options = {
+        ajax: {
+            url: obj.data('sourceurl'),
+            type: 'GET',
+            dataType: 'json',
+            // Use "{{{q}}}" as a placeholder and Ajax Bootstrap Select will
+            // automatically replace it with the value of the search query.
+            data: {
+                term: '{{{q}}}'
+            }
+        },
+        locale: {
+            emptyTitle: ''
+        },
+        clearOnEmpty:false,
+        //log: 3,
+        preprocessData: function (data) {
+            var i, l = data.length, array = [];
+            array.push({
+                        text: clearSelectionLabel,
+                        value: '',
+                        data:{
+                        	update_url: '',
+                        	subtext:''
+                        }
+                    });
+
+            if (l) {
+                for(i = 0; i < l; i++){
+                    array.push($.extend(true, data[i], {
+                        text: data[i]['label'],
+                        value: data[i]['pk'],
+                        data:{
+                        	update_url: data[i]['update'],
+                        	subtext:''
+                        }
+                    }));
+                }
+            }
+            return array;
+        }
+    };
+
+    obj.prepend($("<option></option>")
+		.attr("value",'')
+		.text(clearSelectionLabel)
+		.data('update_url',''));  //Add "clear selection" option
+
+
+	obj.selectpicker().ajaxSelectPicker(options); //Initiaise selectPicker
+	obj.change(function(){ //on change, update the edit button href
+		//console.log('Selectbox Changed');
+		refreshUpdateHref(obj);
+	});
+
+	refreshUpdateHref(obj); //Ensure href is correct at the beginning
+}
+
+$(document).ready(function() {
+    clearSelectionLabel = '(no selection)';
+
+    $(".selectpicker").each(function(){initPicker($(this))});
+
+    //When update/edit modal box submitted
+   $('#modal').on('hide.bs.modal', function (e) {
+        if (modaltarget != undefined && modalobject != "") {
+        	//Update the selector with new values
+        	changeSelectedValue($(modaltarget),modalobject[0]['pk'],modalobject[0]['fields']['name'],modalobject[0]['update_url']);
+        }
+    });
+});

pipeline/source_assets/js/interaction.js

@@ -0,0 +1,139 @@
+function setupItemTable(items_json) {
+    objectitems = JSON.parse(items_json)
+    $.each(objectitems, function (key, val) {
+        objectitems[key] = JSON.parse(val);
+    })
+    newitem = -1;
+}
+
+function nl2br (str, is_xhtml) {
+    var breakTag = (is_xhtml || typeof is_xhtml === 'undefined') ? '<br />' : '<br>';
+    return (str + '').replace(/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g, '$1'+ breakTag +'$2');
+}
+
+function escapeHtml (str) {
+    return $('<div/>').text(str).html();
+}
+
+function updatePrices() {
+    // individual rows
+    var sum = 0;
+    for (var pk in objectitems) {
+        var fields = objectitems[pk].fields;
+        var sub = fields.cost * fields.quantity;
+        $('#item-' + pk + ' .sub-total').html(parseFloat(sub).toFixed(2)).data('subtotal', sub);
+
+        sum += Number(sub);
+    }
+
+    $('#sumtotal').text(parseFloat(sum).toFixed(2));
+    var vat = sum * Number($('#vat-rate').data('rate'));
+    $('#vat').text(parseFloat(vat).toFixed(2));
+    $('#total').text(parseFloat(sum + vat).toFixed(2));
+}
+
+$('#item-table').on('click', '.item-delete', function () {
+    delete objectitems[$(this).data('pk')]
+    $('#item-' + $(this).data('pk')).remove();
+    updatePrices();
+});
+
+$('#item-table').on('click', '.item-add', function () {
+    $('#item-form').data('pk', newitem);
+
+    // Set the form values
+    $('#item_name').val('');
+    $('#item_description').val('');
+    $('#item_quantity').val('');
+    $('#item_cost').val('');
+
+    $($(this).data('target')).modal('show');
+});
+
+$('#item-table').on('click', '.item-edit', function () {
+    // set the pk as we will need this later
+    var pk = $(this).data('pk');
+    $('#item-form').data('pk', pk);
+
+    // Set the form values
+    var fields = objectitems[pk].fields;
+    $('#item_name').val(fields.name);
+    $('#item_description').val(fields.description);
+    $('#item_quantity').val(fields.quantity);
+    $('#item_cost').val(fields.cost);
+
+    $($(this).data('target')).modal('show');
+});
+
+$('body').on('submit', '#item-form', function (e) {
+    e.preventDefault();
+    var pk = $(this).data('pk');
+    $('#itemModal').modal('hide');
+
+    var fields;
+    if (pk == newitem--) {
+        // Create the new data structure and add it on.
+        fields = new Object();
+        fields['name'] = $('#item_name').val()
+        fields['description'] = $('#item_description').val();
+        fields['cost'] = $('#item_cost').val();
+        fields['quantity'] = $('#item_quantity').val();
+
+        var order = 0;
+        for (item in objectitems) {
+            order++;
+        }
+
+        fields['order'] = order;
+
+        objectitems[pk] = new Object();
+        objectitems[pk]['fields'] = fields;
+
+        // Add the new table
+        $('#new-item-row').clone().attr('id', 'item-' + pk).data('pk', pk).appendTo('#item-table-body');
+        $('#item-'+pk+' .item-delete, #item-'+pk+' .item-edit').data('pk', pk)
+    } else {
+        // Existing item
+        // update data structure
+        fields = objectitems[pk].fields;
+        fields.name = $('#item_name').val()
+        fields.description = $('#item_description').val();
+        fields.cost = $('#item_cost').val();
+        fields.quantity = $('#item_quantity').val();
+        objectitems[pk].fields = fields;
+
+    }
+    // update the table
+    $row = $('#item-' + pk);
+    $row.find('.name').html(escapeHtml(fields.name));
+    $row.find('.description').html(nl2br(escapeHtml(fields.description)));
+    $row.find('.cost').html(parseFloat(fields.cost).toFixed(2));
+    $row.find('.quantity').html(fields.quantity);
+
+    updatePrices();
+});
+
+$('body').on('submit', '.itemised_form', function (e) {
+    $('#id_items_json').val(JSON.stringify(objectitems));
+});
+
+// Return a helper with preserved width of cells
+var fixHelper = function (e, ui) {
+    ui.children().each(function () {
+        $(this).width($(this).width());
+    });
+    return ui;
+};
+
+$("#item-table tbody").sortable({
+    helper: fixHelper,
+    update: function (e, ui) {
+        info = $(this).sortable("toArray");
+        itemorder = new Array();
+        $.each(info, function (key, value) {
+            pk = $('#' + value).data('pk');
+            objectitems[pk].fields.order = key;
+        });
+
+    }
+});

pipeline/source_assets/scss/_custom-variables.scss

@@ -0,0 +1,11 @@
+$font-family-sans-serif:  "Open Sans", sans-serif;
+//Make it look less primary school
+$font-size-base: 0.85rem;
+$theme-colors: (
+  "success": #5cb85c,
+  "warning": #f0ad4e,
+  "danger": #d9534f,
+  "info": #5bc0de,
+  "primary": #3A52A2
+) !default;
+$enable-shadows: true;

pipeline/source_assets/scss/dark_screen.scss

@@ -0,0 +1,114 @@
+[data-theme='dark'] {
+    $theme-colors: (
+      "success": #3AB54A,
+      "warning": #FFE89B,
+      "danger": #BF1E2E,
+      "info": #25AAE2,
+      "primary": #3A52A2
+    );
+    @import "custom-variables";
+    @import 'node_modules/@forevolve/bootstrap-dark/scss/bootstrap-dark.scss';
+    background: #222;
+    color: $gray-100;
+    $darktheme: #121416;
+    .navbar {
+        background-color: #111111 !important;
+    }
+    .dropdown-menu {
+        box-shadow: 0 0.5rem 1rem black;
+        color: $gray-100;
+        background: $darktheme;
+    }
+    .form-control:not(.btn) {
+        background-color: $darktheme;
+        color: $gray-100;
+    }
+    .btn-light, .popover, .popover-header, .popover-body, .status {
+        background-color: $darktheme !important;
+        color: $gray-100 !important;
+        border-color: $darktheme;
+    }
+    .bs-popover-right > .arrow::after {
+        border-right-color: $darktheme;
+    }
+    .bs-popover-left > .arrow::after {
+        border-left-color: $darktheme;
+    }
+    .bs-popover-top > .arrow::after {
+        border-top-color: $darktheme;
+    }
+    .bs-popover-bottom > .arrow::after {
+        border-bottom-color: $darktheme;
+    }
+    a {
+        color: $blue;
+    }
+    .badge, .btn-success, .bg-warning {
+        color: black;
+    }
+    .badge-dark, .badge-secondary, .btn-primary {
+        color: $gray-100;
+    }
+    .input-group-text {
+        border-color: $darktheme;
+    }
+    .btn-secondary, .btn-info {
+        color: white;
+    }
+    .page-item.disabled {
+        opacity: 0.5;
+    }
+    .bg-light {
+        color: black;
+        background-color: $gray-200 !important;
+        border-radius: 0.2em;
+    }
+    .fc-day-today {
+        background-color: transparent !important;
+        border: 0.2em solid $info !important;
+    }
+    .fc-daygrid-dot-event {
+        color: white !important;
+    }
+    .table {
+        border-collapse: separate !important;
+        border-spacing: 0;
+    }
+    .table tr th {
+      border-right: 0 !important;
+    }
+    .table tr td {
+      border-left: 0 !important;
+    }
+    .table tr td:not(:last-child) {
+        border-right: 0 !important;
+    }
+    @each $color, $value in $theme-colors {
+        .table-#{$color} {
+            > td,th {
+                border: 0.3em solid theme-color-level($color, -6) !important;
+            }
+            > * {
+                color: white !important;
+                background-color: #222 !important;
+            }
+        }
+    }
+    del {
+      color: black;
+      background-color: $danger;
+      border-radius: 3px;
+    }
+    ins {
+      color: black;
+      background-color: $success;
+      border-radius: 3px;
+    }
+    pre {
+        background: $gray-600;
+        color: white;
+    }
+    .custom-control-input:focus ~ .custom-control-label::before {
+        box-shadow: 0 0 0 $input-focus-width rgba($primary, 0.7) !important;
+    }
+}

pipeline/source_assets/scss/email.scss

@@ -0,0 +1,63 @@
+$button_color: #357ebf;
+
+body{
+  margin: 0px;
+}
+
+.main-table{
+  width: 100%;
+  border-collapse: collapse;
+
+}
+
+.client-header {
+  background-image: url("https://www.nottinghamtec.co.uk/imgs/wof2014-1.jpg");
+  background-color: #222;
+  background-repeat: no-repeat;
+  background-position: center;
+
+  width: 100%;
+
+  margin-bottom: 28px;
+
+  .logos{
+    width: 100%;
+    max-width: 640px;
+  }
+
+  img {
+    height: 110px;
+  }
+}
+
+.content-container{
+  width: 100%;
+
+  .content {
+    font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+
+    width: 100%;
+    max-width: 600px;
+    padding: 10px;
+    text-align: left;
+
+    .button-container{
+      width: 100%;
+
+      .button {
+        padding: 6px 12px;
+        background-color: $button_color;
+        border-radius: 4px;
+
+        a {
+          color: #fff;
+          text-decoration: none;
+        }
+
+      }
+
+    }
+
+  }
+}
+

pipeline/source_assets/scss/print.scss

@@ -0,0 +1 @@
+@import "node_modules/bootstrap/scss/bootstrap";

pipeline/source_assets/scss/screen.scss

@@ -0,0 +1,195 @@
+@import "dark_screen";
+@import "custom-variables";
+@import "node_modules/bootstrap/scss/bootstrap";
+
+@media screen and
+  (prefers-reduced-motion: reduce),
+  (update: slow) {
+  * {
+    animation-duration: 0.001ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.001ms !important;
+  }
+}
+
+.fc-event-main {
+    color: black !important;
+}
+
+.fc-daygrid-dot-event {
+    color: black !important;
+}
+
+.fc-timeGridDay-view {
+    .fc-event-main {
+        font-size: large !important;
+    }
+}
+
+.fc-timeGridWeek-view {
+    .fc-event-main {
+        font-size: 0.9rem;
+    }
+}
+
+#content {
+  padding: 40px 15px;
+}
+
+#userdropdown > li {
+  padding: 0 0.3em;
+}
+
+#userdropdown > li, #activity {
+  .media-object {
+    max-width: 3em;
+  }
+}
+
+.table tbody > tr > td.vert-align {
+  vertical-align: middle;
+}
+
+.align-right {
+  text-align: right;
+}
+
+textarea {
+  width: 100%;
+  resize: vertical;
+}
+
+.custom-combobox {
+  display: block;
+}
+
+.event-mic-photo {
+  max-width: 2em;
+  border-radius: 0.25em;
+}
+
+.item-description {
+  margin-left: 1em;
+}
+
+.overflow-ellipsis {
+  text-overflow: ellipsis;
+  display: inline-block;
+  max-width: 100%;
+  overflow: hidden;
+}
+
+.dont-break-out {
+  overflow-wrap: break-word;
+  word-wrap: break-word;
+  -webkit-hyphens: auto;
+  -ms-hyphens: auto;
+  -moz-hyphens: auto;
+  hyphens: auto;
+}
+
+.modal-dialog {
+  z-index: inherit; // bug fix introduced in 52682ce
+}
+
+del {
+  background-color: #f2dede;
+  border-radius: 3px;
+  padding: 0.1em;
+}
+
+ins {
+  background-color: #dff0d8;
+  border-radius: 3px;
+  padding: 0.1em;
+}
+
+.nav-link {
+  color: $gray-400 !important;
+}
+
+.btn-light {
+    background-color: $gray-200 !important;
+}
+
+.skip-link {
+  background: $dark;
+  outline: unset;
+  height: 30px;
+  left: 50%;
+  padding: 8px;
+  position: absolute;
+  transform: translateY(-100%);
+  transition: transform 0.3s;
+}
+
+.skip-link:focus {
+  transform: translateY(45px); /* TODO Remove absolute positioning */
+}
+
+.errorlist > li {
+    list-style-type: none;
+}
+
+pre {
+    page-break-inside: avoid;
+    font-family: monospace;
+    font-size: 15px;
+    line-height: 1.6;
+    margin-bottom: 1.6em;
+    max-width: 100%;
+    overflow: auto;
+    padding: 1em 1.5em;
+    display: block;
+    word-wrap: break-word;
+}
+
+svg {
+    display: inline;
+    white-space: no-wrap;
+}
+
+html.embedded {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
+  max-height: 100%;
+  overflow: hidden;
+  justify-content: center;
+
+  body{
+    padding:0;
+    width:100%;
+    background:none;
+    overflow: auto;
+  }
+
+  .embed_container{
+    border:5px solid #e9e9e9;
+    padding:12px 0px;
+    min-height:100%;
+    width:100%;
+  }
+
+  .source{
+    background: url('/static/imgs/pyrigs-avatar.png') no-repeat;
+    background-size: 16px 16px;
+    padding-left: 20px;
+    color: #000;
+  }
+
+  h3{
+    margin-top:10px;
+    margin-bottom:5px;
+  }
+
+  p{
+    margin-bottom:2px;
+    font-size: 11px;
+  }
+
+  .event-mic-photo{
+    max-width: 3em;
+  }
+}