renalware-core 2.0.146 → 2.0.152

data/app/inputs/simple_time_input.rb

@@ -2,14 +2,14 @@
 
 class SimpleTimeInput < SimpleForm::Inputs::StringInput
   def input(_wrapper_options)
-    template.content_tag(:div, class: "row collapse datepicker-wrapper") do
+    template.tag.div(class: "row collapse datepicker-wrapper") do
       template.concat prefix_column
       template.concat input_column
     end
   end
 
   def prefix_column
-    template.content_tag(:div, class: "large-2 columns") do
+    template.tag.div(class: "large-2 columns") do
       template.concat icon_clock
     end
   end
@@ -17,7 +17,7 @@ class SimpleTimeInput < SimpleForm::Inputs::StringInput
   def input_column
     html_options = input_html_options
     html_options[:class] ||= []
-    template.content_tag(:div, class: "large-10 columns") do
+    template.tag.div(class: "large-10 columns") do
       time = @builder.object.public_send(attribute_name)
       value = time.present? ? I18n.l(time, format: :time) : ""
       template.concat @builder.text_field(attribute_name, html_options.merge(value: value))

data/app/inputs/trix_editor_input.rb

@@ -1,5 +1,6 @@
 # frozen_string_literal: true
 
+# rubocop:disable Rails/ContentTag
 # See https://github.com/kylefox/trix/blob/master/lib/trix/simple_form/trix_editor_input.rb
 class TrixEditorInput < SimpleForm::Inputs::Base
   def input(_wrapper_options)
@@ -12,3 +13,4 @@ class TrixEditorInput < SimpleForm::Inputs::Base
     template.content_tag("div", hidden_field + editor_tag, class: "trix-editor-wrapper")
   end
 end
+# rubocop:enable Rails/ContentTag

data/app/javascript/renalware/controllers/blas_controller.js

@@ -0,0 +1,37 @@
+// NB Chartkick and Highcharts are defined as global in rollup
+const Highcharts = window.Highcharts
+
+import { Controller } from "stimulus"
+
+export default class extends Controller {
+  static targets = [ "chart", "title" ]
+
+  // E.g. clicked on/hovered over a link so we fetch the json for this anchor's url
+  // and repopulate the graph
+  show(e) {
+    e.preventDefault()
+    fetch(e.currentTarget.href)
+    .then(response => response.json())
+    .then(data => this.refreshChart(data))
+  }
+
+  refreshChart(seriesData) {
+    // Could use chart title instead
+    this.titleTarget.innerHTML = `${seriesData.code} (${seriesData.name})`
+    let options = this.chartOptions
+    options["series"] = [{ name: seriesData.code, data: seriesData.results }]
+    Highcharts.chart(this.chartTarget.id, options)
+  }
+
+  get chartOptions() {
+    return {
+      chart: {
+        type: "line"
+      },
+      xAxis: {
+        type: "date"
+      },
+      series: []
+    }
+  }
+}

data/app/javascript/renalware/controllers/charts_controller.js

@@ -0,0 +1,52 @@
+// NB Chartkick and Highcharts are defined as global in rollup
+const Chartkick = window.Chartkick
+
+import { Controller } from "stimulus"
+
+export default class extends Controller {
+  static targets = [ "chart" ]
+
+  // Called on ajax:success
+  redisplay(event) {
+    // let [json, status, xhr] = event.detail
+    let json = event.detail[0]
+    if (this.chartCreated()) {
+      this.chartTarget.getChartObject().updateData(json)
+    } else {
+      new Chartkick.LineChart("chart1", json, this.chartOptions)
+    }
+  }
+
+  // Returns true if the chart target has already been initialised
+  chartCreated() {
+    return Object.prototype.hasOwnProperty.call(this.chartTarget, "getChartObject")
+  }
+
+  get chartOptions() {
+    return {
+      curve: false,
+      library: {
+        chart: {
+          zoomType: "x"
+        },
+        plotOptions: {
+          series: {
+            animation: {
+              duration: 400
+            }
+          }
+        },
+        colors: [
+          "#005eb8",
+          "#009639",
+          "#434348",
+          "#90ed7d",
+          "#f7a35c",
+          "#8085e9",
+          "#f15c80",
+          "#e4d354"
+        ]
+      }
+    }
+  }
+}

data/app/javascript/renalware/controllers/medications/prescriptions_controller.js

@@ -0,0 +1,24 @@
+import { Controller } from "stimulus"
+
+// Handles the modal dialog used for presenting Home Delivery print options to
+// the user. Used on the prescrptions page.
+export default class extends Controller {
+  static targets = [ "homeDeliveryDates", "providers" ]
+
+  connect() {
+    let radio_value = this.providersTarget.querySelector("input:checked").value
+    this.toggleDeliveryDatesVisibility(radio_value)
+  }
+
+  toggleDeliveryDates(event) {
+    this.toggleDeliveryDatesVisibility(event.target.value)
+  }
+
+  toggleDeliveryDatesVisibility(radio_value) {
+    if (radio_value == "home_delivery") {
+      this.homeDeliveryDatesTarget.style.display = "block"
+    } else {
+      this.homeDeliveryDatesTarget.style.display = "none"
+    }
+  }
+}

data/app/javascript/renalware/controllers/modal_controller.js

@@ -0,0 +1,137 @@
+// Adapted from https://github.com/excid3/tailwindcss-stimulus-components/blob/master/src/modal.js
+// Designed to work with tailwindcss
+//
+// Visit The Stimulus Handbook for more details
+// https://stimulusjs.org/handbook/introduction
+//
+// This example controller works with specially annotated HTML like:
+//
+//<div data-controller="modal" data-modal-allow-background-close="false">
+//  <a href="#" data-action="click->modal#open" class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-3 px-6 rounded">
+//   <span>Open Modal</span>
+//  </a>
+//  <!-- Modal Container -->
+//  <div data-target="modal.container" data-action="click->modal#closeBackground keyup@window->modal#closeWithKeyboard" class="hidden animated fadeIn fixed inset-0 overflow-y-auto flex items-center justify-center" style="z-index: 9999;">
+//    <!-- Modal Inner Container -->
+//    <div class="max-h-screen w-full max-w-lg relative">
+//      <!-- Modal Card -->
+//      <div class="m-1 bg-white rounded shadow">
+//        <div class="p-8">
+//          <h2 class="text-xl mb-4">Large Modal Content</h2>
+//          <p class="mb-4">This is an example modal dialog box.</p>
+//          <div class="flex justify-end items-center flex-wrap mt-6">
+//            <button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded" data-action="click->modal#close">Close</button>
+//          </div>
+//        </div>
+//      </div>
+//    </div>
+//  </div>
+//</div>
+
+import { Controller } from "stimulus"
+
+export default class extends Controller {
+  static targets = ["container"];
+
+  connect() {
+    // The class we should toggle on the container
+    this.toggleClass = this.data.get("class") || "hidden"
+
+    // The HTML for the background element
+    this.backgroundHtml = this.data.get("backgroundHtml") || this._backgroundHTML()
+
+    // The ID of the background to hide/remove
+    this.backgroundId = this.data.get("backgroundId") || "modal-background"
+
+    // Let the user close the modal by clicking on the background
+    this.allowBackgroundClose = (this.data.get("allowBackgroundClose") || "true") === "true"
+  }
+
+  disconnect() {
+    this.close()
+  }
+
+  open(e) {
+    e.preventDefault()
+    e.target.blur()
+
+    // Lock the scroll and save current scroll position
+    this.lockScroll()
+
+    // Unhide the modal
+    this.containerTarget.classList.remove(this.toggleClass)
+
+    // Insert the background
+    if (!this.data.get("disable-backdrop")) {
+      document.body.insertAdjacentHTML("beforeend", this.backgroundHtml)
+      this.background = document.querySelector(`#${this.backgroundId}`)
+    }
+  }
+
+  close(e) {
+    if (e) e.preventDefault()
+
+    // Unlock the scroll and restore previous scroll position
+    this.unlockScroll()
+
+    // Hide the modal
+    this.containerTarget.classList.add(this.toggleClass)
+
+    // Remove the background
+    if (this.background) { this.background.remove() }
+  }
+
+  closeBackground(e) {
+    if (this.allowBackgroundClose && e.target === this.containerTarget) {
+      this.close(e)
+    }
+  }
+
+  closeWithKeyboard(e) {
+    if (e.keyCode === 27 && !this.containerTarget.classList.contains(this.toggleClass)) {
+      this.close(e)
+    }
+  }
+
+  _backgroundHTML() {
+    return "<div id=\"modal-background\" class=\"fixed top-0 left-0 w-full h-full\" style=\"background-color: rgba(0, 0, 0, 0.8); z-index: 9998;\"></div>"
+  }
+
+  lockScroll() {
+    // Add right padding to the body so the page doesn't shift
+    // when we disable scrolling
+    const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth
+    document.body.style.paddingRight = `${scrollbarWidth}px`
+
+    // Save the scroll position
+    this.saveScrollPosition()
+
+    // Add classes to body to fix its position
+    document.body.classList.add("fixed", "inset-x-0", "overflow-hidden")
+
+    // Add negative top position in order for body to stay in place
+    document.body.style.top = `-${this.scrollPosition}px`
+  }
+
+  unlockScroll() {
+    // Remove tweaks for scrollbar
+    document.body.style.paddingRight = null
+
+    // Remove classes from body to unfix position
+    document.body.classList.remove("fixed", "inset-x-0", "overflow-hidden")
+
+    // Restore the scroll position of the body before it got locked
+    this.restoreScrollPosition()
+
+    // Remove the negative top inline style from body
+    document.body.style.top = null
+  }
+
+  saveScrollPosition() {
+    this.scrollPosition = window.pageYOffset || document.body.scrollTop
+  }
+
+  restoreScrollPosition() {
+    document.documentElement.scrollTop = this.scrollPosition
+  }
+}

data/app/javascript/renalware/controllers/pathology/sparklines_controller.js

@@ -0,0 +1,206 @@
+// NB Chartkick and Highcharts are defined as global in rollup
+// const Chartkick = window.Chartkick
+
+
+import { Controller } from "stimulus"
+
+export default class extends Controller {
+  static targets = ["chart"]
+
+  connect() {
+    // let data = this.data.get("chartData")
+    // let chartId = this.chartTarget.id
+
+    // console.log(chartId)
+    // let json = [
+    //     {
+    //       name: "",
+    //       data: data
+    //     }
+    //   ]
+    console.log("Not implemented")
+    //Highcharts.SparkLine(this.chartTarget, {})
+    //     series: [{
+    //         name: '',
+    //         data: data
+    //    }]
+    // })
+    //new Chartkick.LineChart(chartId, json, this.chartOptions)
+  }
+
+  // get chartOptions() {
+  //   return {
+  //     library: {
+  //       chart: {
+  //         type: "area",
+  //         margin: [0, 0, 0, 0],
+  //         height: 20,
+  //         width: 80,
+  //         skipClone: true,
+  //         style: {
+  //           overflow: "visible"
+  //         }
+  //       },
+  //       credits: {
+  //         enabled: false
+  //       },
+  //       title: "",
+  //       xAxis: {
+  //         type: "datetime",
+  //         tickPositions: [],
+  //         labels: {
+  //           enabled: false
+  //         },
+  //         startOnTick: false,
+  //         endOnTick: false,
+  //         title: {
+  //           text: null
+  //         }
+  //       },
+  //       legend: {
+  //         enabled: false
+  //       },
+  //       yAxis: {
+  //         tickPositions: [0],
+  //         endOnTick: false,
+  //         startOnTick: false,
+  //         title: {
+  //           text: null
+  //         },
+  //         min: 0,
+  //         labels: {
+  //           enabled: false
+  //         }
+  //       },
+  //       tooltip: {
+  //         hideDelay: 0,
+  //         outside: true,
+  //         shared: true,
+  //         xDateFormat: '%d-%b-%Y'
+  //       },
+  //       plotOptions: {
+  //         series: {
+  //           animation: false,
+  //           lineWidth: 1,
+  //           shadow: false,
+  //           states: {
+  //             hover: {
+  //               lineWidth: 1
+  //             }
+  //           },
+  //           marker: {
+  //             radius: 1,
+  //             states: {
+  //               hover: {
+  //                 radius: 2
+  //               }
+  //             }
+  //           },
+  //           fillOpacity: 0.25
+  //         },
+  //         column: {
+  //           negativeColor: "#910000",
+  //           borderColor: "silver"
+  //         }
+  //       }
+  //     }
+  //   }
+  // }
+}
+  /**
+  * Create a constructor for sparklines that takes some sensible defaults and merges in the individual
+  * chart options.
+  */
+
+  /*
+  window.Highcharts.SparkLine = function (a, b, c) {
+  console.log("defining1");
+  var hasRenderToArg = typeof a === 'string' || a.nodeName,
+      options = arguments[hasRenderToArg ? 1 : 0],
+      defaultOptions = {
+          chart: {
+              renderTo: (options.chart && options.chart.renderTo) || this,
+              backgroundColor: null,
+              borderWidth: 0,
+              type: 'area',
+              margin: [2, 0, 2, 0],
+              width: 120,
+              height: 20,
+              style: {
+                  overflow: 'visible'
+              },
+
+              // small optimalization, saves 1-2 ms each sparkline
+              skipClone: true
+          },
+          title: {
+              text: ''
+          },
+          credits: {
+              enabled: false
+          },
+          xAxis: {
+              labels: {
+                  enabled: false
+              },
+              title: {
+                  text: null
+              },
+              startOnTick: false,
+              endOnTick: false,
+              tickPositions: []
+          },
+          yAxis: {
+              endOnTick: false,
+              startOnTick: false,
+              labels: {
+                  enabled: false
+              },
+              title: {
+                  text: null
+              },
+              tickPositions: [0]
+          },
+          legend: {
+              enabled: false
+          },
+          tooltip: {
+              hideDelay: 0,
+              outside: true,
+              shared: true
+          },
+          plotOptions: {
+              series: {
+                  animation: false,
+                  lineWidth: 1,
+                  shadow: false,
+                  states: {
+                      hover: {
+                          lineWidth: 1
+                      }
+                  },
+                  marker: {
+                      radius: 1,
+                      states: {
+                          hover: {
+                              radius: 2
+                          }
+                      }
+                  },
+                  fillOpacity: 0.25
+              },
+              column: {
+                  negativeColor: '#910000',
+                  borderColor: 'silver'
+              }
+          }
+      };
+
+  options = Highcharts.merge(defaultOptions, options);
+
+  return hasRenderToArg ?
+      new Highcharts.Chart(a, options, c) :
+      new Highcharts.Chart(options, b)
+}
+
+  */