swop 0.1.0

data/app/assets/javascripts/rails_admin/custom/filtering-select.js

@@ -0,0 +1,304 @@
+import jQuery from "jquery";
+import "jquery-ui/ui/widget.js";
+import "jquery-ui/ui/widgets/autocomplete.js";
+import I18n from "./i18n";
+
+(function ($) {
+  "use strict";
+
+  $.widget("ra.filteringSelect", $.ra.abstractSelect, {
+    options: {
+      minLength: 0,
+      searchDelay: 200,
+      remote_source: null,
+      source: null,
+      xhr: false,
+    },
+
+    button: null,
+    input: null,
+    select: null,
+    filtering_select: null,
+
+    _create: function () {
+      this.filtering_select = this.element.siblings(
+        '[data-input-for="' + this.element.attr("id") + '"]'
+      );
+
+      // When using the browser back and forward buttons, it is possible that
+      // the autocomplete field will be cached which causes duplicate fields
+      // to be generated.
+      if (this.filtering_select.length > 0) {
+        this.input = this.filtering_select.children("input");
+        this.button = this.filtering_select.children(".input-group-btn");
+      } else {
+        this.element.hide();
+        this.filtering_select = this._inputGroup(this.element.attr("id"));
+        this.input = this._inputField();
+        this.button = this._buttonField();
+      }
+      this.clearOption = $('<span></span>').append(
+        '<i class="fas fa-times me-2"></i> ' +
+          $('<span></span>').text(I18n.t("clear")).html()
+      );
+      this.noObjectsPlaceholder = $('<option disabled="disabled" />').text(
+        I18n.t("no_objects")
+      );
+
+      this._setOptionsSource();
+      this._initAutocomplete();
+      this._initKeyEvent();
+      this._overloadRenderItem();
+      this._autocompleteDropdownEvent(this.button);
+
+      return this.filtering_select
+        .append(this.input)
+        .append(this.button)
+        .insertAfter(this.element);
+    },
+
+    _getResultSet: function (request, data, xhr) {
+      var matcher = new RegExp(
+        $.ui.autocomplete.escapeRegex(request.term),
+        "i"
+      );
+
+      var spannedContent = function (content) {
+        return $("<span>").text(content).html();
+      };
+
+      var highlighter = function (label, word) {
+        if (word.length) {
+          return $.map(label.split(word), function (el) {
+            return spannedContent(el);
+          }).join($("<strong>").text(word)[0].outerHTML);
+        } else {
+          return spannedContent(label);
+        }
+      };
+
+      var matches = $.map(data, function (el) {
+        var id = el.id || el.value;
+        var value = el.label || el.id;
+        // match regexp only for local requests, remote ones are already
+        // filtered, and label may not contain filtered term.
+        if (id && (xhr || matcher.test(el.label))) {
+          return {
+            html: highlighter(value, request.term),
+            value: value,
+            id: id,
+          };
+        }
+      });
+
+      if (request.term.length === 0 && !this.input.attr("required")) {
+        return [{ html: this.clearOption, value: null, id: null }].concat(
+          matches
+        );
+      } else if (matches.length === 0) {
+        return [{ html: this.noObjectsPlaceholder, value: null, id: null }];
+      } else {
+        return matches;
+      }
+    },
+
+    _getSourceFunction: function (source) {
+      var self = this;
+      var requestIndex = 0;
+
+      if ($.isArray(source)) {
+        return function (request, response) {
+          response(self._getResultSet(request, source, false));
+        };
+      } else if (typeof source === "string") {
+        return function (request, response) {
+          if (this.xhr) {
+            this.xhr.abort();
+          }
+
+          this.xhr = $.ajax({
+            url: source,
+            data: self.options.createQuery(request.term),
+            dataType: "json",
+            autocompleteRequest: ++requestIndex,
+            success: function (data, status) {
+              if (this.autocompleteRequest === requestIndex) {
+                response(self._getResultSet(request, data, true));
+              }
+            },
+            error: function () {
+              if (this.autocompleteRequest === requestIndex) {
+                response([]);
+              }
+            },
+          });
+        };
+      } else {
+        return source;
+      }
+    },
+
+    _setOptionsSource: function () {
+      if (this.options.xhr) {
+        this.options.source = this.options.remote_source;
+      } else {
+        this.options.source = this.element
+          .children("option")
+          .map(function () {
+            return { label: $(this).text(), value: this.value };
+          })
+          .toArray();
+      }
+    },
+
+    _buttonField: function () {
+      return $(
+        '<div class="input-group-btn btn btn-white dropdown-toggle">' +
+        "</div>"
+      );
+    },
+
+    _autocompleteDropdownEvent: function (element) {
+      var self = this;
+
+      return element.click(function () {
+        // close if already visible
+        if (self.input.autocomplete("widget").is(":visible")) {
+          self.input.autocomplete("close");
+          return;
+        }
+
+        // pass empty string as value to search for, displaying all results
+        self.input.autocomplete("search", "");
+        self.input.focus();
+      });
+    },
+
+    _inputField: function () {
+      var input;
+      var selected = this.element.children(":selected");
+      var value = selected.val() ? selected.text() : "";
+
+      input = $('<input type="text">')
+        .val(value)
+        .addClass("form-control ra-filtering-select-input")
+        .attr("style", this.element.attr("style"))
+        .show();
+
+      if (this.element.attr("placeholder")) {
+        input.attr("placeholder", this.element.attr("placeholder"));
+      }
+
+      if (this.element.attr("required")) {
+        input.attr("required", this.element.attr("required"));
+        this.element.attr("required", false);
+      }
+
+      return input;
+    },
+
+    _inputGroup: function (inputFor) {
+      return $("<div>")
+        .addClass("input-group filtering-select")
+        .attr("data-input-for", inputFor);
+    },
+
+    _initAutocomplete: function () {
+      var self = this;
+
+      return this.input.autocomplete({
+        delay: this.options.searchDelay,
+        minLength: this.options.minLength,
+        source: this._getSourceFunction(this.options.source),
+        select: function (event, ui) {
+          var option = self.element.find(
+            `option[value="${CSS.escape(ui.item.id)}"]`
+          );
+          self.element.find("option[selected]").attr("selected", false);
+          if (option.length > 0) {
+            option.attr("selected", "selected");
+          } else {
+            option = $("<option>")
+              .attr("value", ui.item.id)
+              .attr("selected", true)
+              .text(ui.item.value);
+            self.element.append(option);
+          }
+          self.element.trigger("change", ui.item.id);
+          self._trigger("selected", event, {
+            item: option,
+          });
+          $(self.element.parents(".controls")[0])
+            .find(".update")
+            .removeClass("disabled");
+        },
+        change: function (event, ui) {
+          if (ui.item) {
+            return;
+          }
+
+          var matcher = new RegExp(
+            "^" + $.ui.autocomplete.escapeRegex($(this).val()) + "$",
+            "i"
+          );
+          var valid = false;
+
+          self.element.children("option").each(function () {
+            if ($(this).text().match(matcher)) {
+              valid = true;
+              return false;
+            }
+          });
+
+          if (valid || $(this).val() !== "") {
+            return;
+          }
+
+          // remove invalid value, as it didn't match anything
+          $(this).val(null);
+          self.element.html(
+            $('<option value="" selected="selected"></option>')
+          );
+          self.input.data("ui-autocomplete").term = "";
+          $(self.element.parents(".controls")[0])
+            .find(".update")
+            .addClass("disabled");
+          return false;
+        },
+      });
+    },
+
+    _initKeyEvent: function () {
+      var self = this;
+
+      return this.input.keyup(function () {
+        if ($(this).val().length) {
+          return;
+        }
+
+        /* Clear select options and trigger change if selected item is deleted */
+        return self.element
+          .html($('<option value="" selected="selected"></option>'))
+          .trigger("change");
+      });
+    },
+
+    _overloadRenderItem: function () {
+      this.input.data("ui-autocomplete")._renderItem = function (ul, item) {
+        return $("<li></li>")
+          .data("ui-autocomplete-item", item)
+          .append($("<a></a>").html(item.html || item.id))
+          .appendTo(ul);
+      };
+    },
+
+    destroy: function () {
+      this.input.remove();
+      this.button.remove();
+      this.element.html($('<option value="" selected="selected"></option>'));
+      this.element.show();
+      this.filtering_select.remove();
+      $.Widget.prototype.destroy.call(this);
+    },
+  });
+})(jQuery);

data/app/assets/javascripts/rails_admin/custom/sidescroll.js

@@ -0,0 +1,20 @@
+"use strict";
+
+{
+  document.addEventListener("rails_admin.dom_ready", () => {
+    const scroller = document.getElementById("sidescroll");
+    if (!scroller) {
+      return;
+    }
+
+    scroller.querySelectorAll("tr").forEach((tr, index) => {
+      let firstPosition;
+      tr.querySelectorAll("th.sticky, td.sticky").forEach((td, idx) => {
+        if (idx === 0) {
+          firstPosition = td.offsetLeft;
+        }
+        td.style.left = `${td.offsetLeft + -12 - firstPosition}px`;
+      });
+    });
+  });
+}

data/app/assets/javascripts/rails_admin/custom/ui.js

@@ -0,0 +1,11 @@
+import jQuery from "jquery";
+import "jquery-ui/ui/effect.js";
+
+(function ($) {
+
+  $(document).on("change", "#reverse-selection", function () {
+    const isChecked = $(this).is(":checked"); // true if checked, false if unchecked
+    $(this).closest(".checkbox").next(".control-group").find(".controls input:checkbox").prop("checked", isChecked);
+  });
+
+})(jQuery);

data/app/assets/stylesheets/rails_admin/application.scss.erb

@@ -0,0 +1,52 @@
+@charset "UTF-8";
+
+// Mixins
+@import "rails_admin/styles/base/mixins";
+@import "rails_admin/custom/base/base";
+@import "rails_admin/custom/base/mixins";
+
+// Variables
+@import "rails_admin/custom/base/variables";
+@import "rails_admin/custom/base/bootstrap-variables";
+@import "rails_admin/styles/base/variables";
+
+// Bootstrap
+@import "rails_admin/bootstrap/bootstrap";
+
+// Libraries
+@import "rails_admin/flatpickr";
+@import "rails_admin/styles/filtering-select";
+@import "rails_admin/styles/filtering-multiselect";
+@import "rails_admin/styles/widgets";
+
+// Font Awesome
+@import "rails_admin/font-awesome";
+
+// RailsAdmin Theming
+@import "rails_admin/styles/base/theming";
+
+// Base
+@import "rails_admin/custom/base/typography";
+
+// Layouts
+@import "rails_admin/custom/layouts/body";
+@import "rails_admin/custom/layouts/containers";
+
+// Components
+@import "rails_admin/custom/components/breadcrumbs";
+@import "rails_admin/custom/components/buttons";
+@import "rails_admin/custom/components/dropdowns";
+@import "rails_admin/custom/components/filtering-select";
+@import "rails_admin/custom/components/forms";
+@import "rails_admin/custom/components/images";
+@import "rails_admin/custom/components/navbar";
+@import "rails_admin/custom/components/navs";
+@import "rails_admin/custom/components/offcanvas";
+@import "rails_admin/custom/components/progress";
+@import "rails_admin/custom/components/sidebar";
+@import "rails_admin/custom/components/table";
+@import "rails_admin/custom/components/tiles";
+
+<% if defined?(ActionText::Engine) && Rails.gem_version >= Gem::Version.new('7.0') %>
+  @import "trix";
+<% end %>

data/app/assets/stylesheets/rails_admin/custom/base/base.scss

@@ -0,0 +1,5 @@
+// Font anti-aliasing fix for Mac users
+* {
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+}

data/app/assets/stylesheets/rails_admin/custom/base/bootstrap-variables.scss

@@ -0,0 +1,196 @@
+// Color system
+$white: $white;
+$black: $black;
+
+$primary: $primary-color;
+$secondary: $secondary-color;
+$success: $success-color;
+$info: $info-color;
+$warning: $warning-color;
+$danger: $danger-color;
+$light: $light-color;
+$dark: $dark-color;
+
+// Spacing
+$spacer: $spacer;
+$spacers: (
+  0: 0,
+  1: $spacer-1,
+  2: $spacer-2,
+  3: $spacer-3,
+  4: $spacer-4,
+  5: $spacer-5,
+  6: $spacer-6,
+  7: $spacer-7,
+  8: $spacer-8,
+  9: $spacer-9,
+  10: $spacer-10,
+  11: $spacer-11
+);
+
+// Body
+$body-color: $text-color;
+$body-bg: $light-color;
+
+$body-secondary-color: $text-secondary-color;
+$text-muted: $text-secondary-color;
+
+// Links
+$link-decoration: none;
+
+// Paragraphs
+$paragraph-margin-bottom: $spacer-3;
+
+// Grid columns
+$grid-columns: 24;
+$grid-gutter-width: $spacer-6;
+
+// Components
+$border-width: $border-width;
+$border-color: $border-color;
+
+$border-radius: $md-border-radius;
+$border-radius-sm: $sm-border-radius;
+$border-radius-lg: $lg-border-radius;
+
+$box-shadow: $md-box-shadow;
+$box-shadow-lg: $lg-box-shadow;
+
+$transition-base: $md-transition;
+
+// Typography
+$font-family-sans-serif: $body-family;
+
+$font-size-base: $base-font-size;
+$font-size-sm: $sm-font-size;
+$font-size-lg: $lg-font-size;
+
+$font-weight-normal: $fw-normal;
+$font-weight-medium: $fw-medium;
+$font-weight-semibold: $fw-semibold;
+$font-weight-bold: $fw-bold;
+
+$font-weight-base: $fw-medium;
+
+$line-height-base: 1.625;
+
+$h1-font-size: $h1-font-size;
+$h2-font-size: $h2-font-size;
+$h3-font-size: $h3-font-size;
+$h4-font-size: $h4-font-size;
+$h5-font-size: $h5-font-size;
+$h6-font-size: $h6-font-size;
+
+$headings-margin-bottom: $spacer-2;
+$headings-font-family: $headings-family;
+$headings-font-weight: $fw-extrabold;
+$headings-color: $dark-color;
+
+$lead-font-size: $lg-font-size;
+$lead-font-weight: $fw-medium;
+
+$hr-margin-y: 0;
+$hr-color: $border-color;
+
+$hr-border-color: $border-color;
+$hr-border-width: $border-width;
+$hr-opacity: 1;
+
+// Buttons + Forms
+$input-btn-padding-y: $spacer * 1.75; // 7px
+$input-btn-padding-x: $spacer * 3.5;  // 14px
+
+$input-btn-padding-y-sm: $spacer * 1.5; // 6px
+$input-btn-padding-x-sm: $spacer * 3;   // 12px
+
+$input-btn-padding-y-lg: $spacer * 2; // 8px
+$input-btn-padding-x-lg: $spacer * 4; // 16px
+
+// Buttons
+$btn-padding-x: $spacer * 4; // 16px
+
+$btn-padding-x-sm: $spacer * 3.5; // 14px
+
+$btn-padding-x-lg: $spacer * 5; // 20px
+
+$btn-font-weight: $fw-bold;
+
+$btn-border-radius: $spacer * 2.5;  // 10px
+$btn-border-radius-sm: $spacer * 2; // 8px
+$btn-border-radius-lg: $spacer * 3; // 12px
+
+// Forms
+$form-text-margin-top: $spacer-1;
+$form-text-font-size: $sm-font-size;
+$form-text-color: $text-secondary-color;
+
+$form-label-margin-bottom: $spacer-1;
+$form-label-font-size: $sm-font-size;
+$form-label-font-weight: $fw-semibold;
+$form-label-color: $dark-color;
+
+$input-bg: $white;
+$input-disabled-color: $text-secondary-color;
+$input-disabled-bg: $light-color;
+$input-disabled-border-color: $light-color;
+
+$input-border-color: $border-color;
+
+$form-check-padding-start: $spacer-7;
+$form-check-margin-bottom: 0;
+$form-check-label-color: $form-label-color;
+
+$form-check-input-border: $border-width solid $border-color;
+
+$form-switch-color: $border-color;
+$form-switch-padding-start: 0;
+
+// Navbar
+$navbar-toggler-padding-y: $spacer-1;
+$navbar-toggler-padding-x: $spacer-1;
+$navbar-toggler-font-size: 0;
+
+// Dropdowns
+$dropdown-min-width: rem(175px);
+$dropdown-padding-x: 0;
+$dropdown-padding-y: $spacer-2;
+$dropdown-spacer: $spacer-2;
+$dropdown-font-size: $sm-font-size;
+$dropdown-border-width: 0;
+$dropdown-divider-margin-y: $spacer-4;
+
+$dropdown-link-hover-color: $dark-color;
+$dropdown-link-hover-bg: rgba($dark-color, 0.05);
+
+$dropdown-link-active-color: $dark-color;
+$dropdown-link-active-bg: rgba($dark-color, 0.05);
+
+$dropdown-link-disabled-color: $text-secondary-color;
+
+$dropdown-item-padding-y: $spacer * 1.75; // 7px
+$dropdown-item-padding-x: $spacer-4;
+
+$dropdown-header-color: $text-secondary-color;
+$dropdown-header-padding-x: $dropdown-item-padding-x;
+$dropdown-header-padding-y: $dropdown-padding-y;
+$dropdown-header-padding: $dropdown-header-padding-y $dropdown-header-padding-x;
+
+// Progress bars
+$progress-height: rem(16px);
+$progress-font-size: $xs-font-size;
+$progress-bg: $border-color;
+$progress-border-radius: $lg-border-radius;
+
+// Badges
+$badge-font-size: $xs-font-size;
+$badge-padding-y: $spacer-1;
+$badge-padding-x: $spacer-2;
+$badge-border-radius: $sm-border-radius;
+
+// Offcanvas
+$offcanvas-padding-y: $spacer-4;
+$offcanvas-padding-x: $spacer-3;
+$offcanvas-horizontal-width: rem(299px);
+$offcanvas-border-width: 0;
+$offcanvas-bg-color: transparent;
+$offcanvas-box-shadow: none;

data/app/assets/stylesheets/rails_admin/custom/base/mixins.scss

@@ -0,0 +1,88 @@
+$rem-baseline: 16px !default;
+$rem-fallback: false !default;
+$rem-px-only: false !default;
+
+@function rem-separator($list, $separator: false) {
+  @if $separator == "comma" or $separator == "space" {
+    @return append($list, null, $separator);
+  }
+
+  @if function-exists("list-separator") == true {
+    @return list-separator($list);
+  }
+
+  // list-separator polyfill by Hugo Giraudel (https://sass-compatibility.github.io/#list_separator_function)
+  $test-list: ();
+  @each $item in $list {
+    $test-list: append($test-list, $item, space);
+  }
+
+  @return if($test-list == $list, space, comma);
+}
+
+@mixin rem-baseline($zoom: 100%) {
+  font-size: ($zoom / 16px) * $rem-baseline;
+}
+
+@function rem-convert($to, $values...) {
+  $result: ();
+  $separator: rem-separator($values);
+
+  @each $value in $values {
+    @if type-of($value) == "number" and unit($value) == "rem" and $to == "px" {
+      $result: append($result, ($value / 1rem) * $rem-baseline, $separator);
+    } @else if type-of($value) == "number" and unit($value) == "px" and $to == "rem" {
+      $result: append($result, ($value / $rem-baseline) * 1rem, $separator);
+    } @else if type-of($value) == "list" {
+      $value-separator: rem-separator($value);
+      $value: rem-convert($to, $value...);
+      $value: rem-separator($value, $value-separator);
+      $result: append($result, $value, $separator);
+    } @else {
+      $result: append($result, $value, $separator);
+    }
+  }
+
+  @return if(length($result) == 1, nth($result, 1), $result);
+}
+
+@function rem($values...) {
+  @if $rem-px-only {
+    @return rem-convert(px, $values...);
+  } @else {
+    @return rem-convert(rem, $values...);
+  }
+}
+
+@mixin rem($properties, $values...) {
+  @if type-of($properties) == "map" {
+    @each $property in map-keys($properties) {
+      @include rem($property, map-get($properties, $property));
+    }
+  } @else {
+    @each $property in $properties {
+      @if $rem-fallback or $rem-px-only {
+        #{$property}: rem-convert(px, $values...);
+      }
+      @if not $rem-px-only {
+        #{$property}: rem-convert(rem, $values...);
+      }
+    }
+  }
+}
+
+//does not work with colors containing alpha
+@function encode-color($string) {
+	@if type-of($string) == 'color' {
+    $hex: str-slice(ie-hex-str($string), 4);
+    $string:unquote("#{$hex}");
+  }
+  $string: '%23' + $string;
+	@return $string;
+}
+
+@mixin text-gradient() {
+  -webkit-background-clip: text;
+  background-clip: text;
+  -webkit-text-fill-color: transparent;
+}

data/app/assets/stylesheets/rails_admin/custom/base/typography.scss

@@ -0,0 +1,16 @@
+h1, .h1,
+h2, .h2,
+h3, .h3,
+h4, .h4,
+h5, .h5,
+h6, .h6 {
+  letter-spacing: -0.02em;
+}
+
+.fw-semibold {
+  font-weight: $fw-semibold !important;
+}
+
+.fw-extrabold {
+  font-weight: $fw-extrabold !important;
+}