wallaby 5.1.8 → 6.0.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
-SHA1:
-  metadata.gz: 318bd15ba641b3b9df0b8c846f77c1d83b63780d
-  data.tar.gz: ae1f37f527a3f64543ee1b035922de1754f448f5
+SHA256:
+  metadata.gz: bd38845513b50b694139c2bb350f9605e8bc9072113de6618bf385cd475b4a96
+  data.tar.gz: 969b97c00b1baaccacbbe34b40d82a760c1a23f73d9ae6a0aa7e3ea87d6bbc04
 SHA512:
-  metadata.gz: 36fcec2d778497d8d1baa282db7377c888419c44187c1b292d324af585f8bd9343a852d6dae3f0742237065387d4fc87cc631f1fcef60072132b2d32300ed0e3
-  data.tar.gz: 43b79d5bd13336a0b4034cab3161503e527156fb0e95c1990efb1f9edd1fbc1cacb82701084ce115ee94e4516e3b8af1b47340089fd0fb0c63f577e1843d15c1
+  metadata.gz: ed267e33e11e6f0b28e3fc906203c4b65ac330dacde9b61744ff1334c9be4217cb74972560ce42348f6ab63384dc535060dc703e23f6e887ebbef93c557338fe
+  data.tar.gz: 2b6bb21c7d8d8592831e9747be169083a9a84ddf11e6bc4897511029f770123c68b31b91c34212aaa83e16ff990f181dce942a4431384efbd0a1f721813bb9fd

data/app/assets/javascripts/wallaby/auto_select.js

@@ -1,77 +1,104 @@
-'use strict';
+/* global jQuery, Bloodhound */
 
-jQuery.fn.extend({
-  auto_select: function (typeahead_options, engine_options) {
-    var $this = jQuery(this),
-        $input = jQuery('div input', this),
-        $template = jQuery('<li><input type="hidden" /><a href="javascript:,"></a></li>'),
-        name = $input.attr('name'),
-        multiple = $input.attr('multiple');
+(function (jQuery, Bloodhound) {
+  'use strict';
 
-    var recreate_typeahead = function () {
-      var data = $this.data(),
-          options = jQuery.extend({
-            highlight: true,
-            hint: true,
-            minLength: 1
-          }, typeahead_options || {}),
-          source_options = {
-            name: data.source,
-            display: 'label',
-            source: new Bloodhound(jQuery.extend({
+  var  $template = jQuery('<li><input type="hidden" /><a href="javascript:;"></a></li>');
+
+  jQuery.fn.extend({
+    auto_select: function (typeaheadOptions, engineOptions) {
+      jQuery(this).each(function () {
+        var $container = jQuery(this),
+            $input = $container.find('div input:visible');
+
+        setup($container, $input, typeaheadOptions, engineOptions);
+
+        $input
+          .off('typeahead:select')
+          .off('typeahead:change')
+          .on('typeahead:select typeahead:autocomplete', function onSelect(_event, suggestion) {
+            appendAndFocusOnSelection($container, $input, suggestion);
+          })
+          .on('keypress', ignoreTabAndEnter);
+
+        $container
+          .off('click.auto_select')
+          .on('click.auto_select', 'a', function onRemove(_event) {
+            jQuery(this).parent().remove();
+            disableTypeaheadOnSingleSelection($container, $input);
+          });
+      });
+    }
+  });
+
+  function setup($container, $input, typeaheadOptions, engineOptions) {
+    moveAttributesIntoDataFor($input);
+    recreateTypeahead($input, typeaheadOptions, engineOptions, $container.data());
+    disableTypeaheadOnSingleSelection($container, $input);
+  }
+
+  function moveAttributesIntoDataFor($input) {
+    $input.data('name', $input.attr('name'));
+    $input.data('multiple', $input.attr('multiple'));
+    $input.removeAttr('name').removeAttr('multiple');
+  }
+
+  function recreateTypeahead($input, typeaheadOptions, engineOptions, containerOptions) {
+    var options = jQuery.extend({
+          highlight: true,
+          hint: true,
+          minLength: 1
+        }, typeaheadOptions),
+        sourceOptions = {
+          name: containerOptions.source,
+          display: 'label',
+          source: new Bloodhound(
+            jQuery.extend({
               remote: {
-                url: data.url,
-                wildcard: data.wildcard
+                url: containerOptions.url,
+                wildcard: containerOptions.wildcard
               },
               queryTokenizer: Bloodhound.tokenizers.whitespace,
               datumTokenizer: Bloodhound.tokenizers.whitespace
-            }, engine_options || {}))
-          };
-      $input.typeahead('destroy')
-      $input.typeahead(options, source_options);
-    };
-    $this.off('reload.auto_select')
-      .on('reload.auto_select', recreate_typeahead)
-      .trigger('reload.auto_select');
+            }, engineOptions)
+          )
+        };
 
-    var disable_typeahead_on_single_selection = function () {
-      $input.prop('disabled', !multiple && $this.find('a').length === 1);
-      $this.find('.auto_select__count span').text($this.find('a').length);
-    };
-    $this.off('update.auto_select')
-      .on('update.auto_select', disable_typeahead_on_single_selection)
-      .trigger('update.auto_select');
+    $input.typeahead('destroy')
+    $input.typeahead(options, sourceOptions);
+  }
 
-    $input.removeAttr('name').removeAttr('multiple'); // some clean up for the input
+  function disableTypeaheadOnSingleSelection($container, $input) {
+    var $anchors = $container.find('a'),
+        $count = $container.find('.auto_select__count span'),
+        countOfAnchors = $anchors.length,
+        isMultiple = $input.data('multiple');
+    $input.prop('disabled', !isMultiple && countOfAnchors === 1);
+    $count.text(countOfAnchors);
+  }
 
-    var append_and_focus_on_selection = function (event, suggestion) {
-      var $a,
-          $existing = $this.find('input[value=' + suggestion.id + ']');
-      if ($existing.length) {
-        $a = $existing.next();
-      } else {
-        var $new_item = $template.clone();
-        $new_item.find('input').attr('name', name).val(suggestion.id);
-        $this.find('ul').append($new_item);
-        $a = $new_item.find('a').text(suggestion.label);
-        $this.trigger('update.auto_select');
-      }
-      if (multiple) { $a.focus(); }
-      $input.typeahead('val', '');
-    };
-    var ignore_tab_and_enter = function (e) {
-      var k = e.keyCode || e.which;
-      if (k === 13) { return false; }
-    };
-    $input.off('typeahead:select').off('typeahead:change')
-      .on('typeahead:select typeahead:autocomplete', append_and_focus_on_selection)
-      .on('keypress', ignore_tab_and_enter);
+  function appendAndFocusOnSelection($container, $input, suggestion) {
+    var $anchor,
+        $existing = $container.find('input[value=' + suggestion.id + ']'),
+        isMultiple = $input.data('multiple'),
+        inputName = $input.data('name');
+    if ($existing.length) {
+      $anchor = $existing.next();
+    } else {
+      var $newItem = $template.clone(),
+          $itemInput = $newItem.find('input'),
+          $list = $container.find('ul');
+      $itemInput.attr('name', inputName).val(suggestion.id);
+      $list.append($newItem);
+      $anchor = $newItem.find('a').text(suggestion.label);
+      disableTypeaheadOnSingleSelection($container, $input);
+    }
+    if (isMultiple) { $anchor.focus(); }
+    $input.typeahead('val', '');
+  }
 
-    var remove_selection = function () {
-      jQuery(this).parent().remove();
-      $this.trigger('update.auto_select');
-    };
-    $this.off('click.auto_select').
-      on('click.auto_select', 'a', remove_selection);
+  function ignoreTabAndEnter(event) {
+    var keyCode = event.keyCode || event.which;
+    if (keyCode === 13 || keyCode === 9) { return false; }
   }
-});
+})(jQuery, Bloodhound);

data/app/assets/javascripts/wallaby/base.js

@@ -1,16 +1,18 @@
 //= require jquery
 //= require jquery_ujs
-//= require bootstrap-sprockets
+//= require popper
+//= require bootstrap
 //= require moment
-//= require bootstrap-datetimepicker
-//= require summernote
-//= require codemirror
-//= require codemirror/addons/mode/overlay
-//= require codemirror/modes/ruby
-//= require codemirror/modes/javascript
-//= require codemirror/modes/markdown
-//= require codemirror/modes/gfm
-//= require codemirror/modes/xml
+//= require moment-timezone-with-data
+//= require tempusdominus-bootstrap-4
+//= require summernote/summernote-bs4.min
+//= require codemirror/5.49.2/lib/codemirror.js
+//= require codemirror/5.49.2/addon/mode/overlay.js
+//= require codemirror/5.49.2/mode/ruby/ruby.js
+//= require codemirror/5.49.2/mode/javascript/javascript.js
+//= require codemirror/5.49.2/mode/markdown/markdown.js
+//= require codemirror/5.49.2/mode/gfm/gfm.js
+//= require codemirror/5.49.2/mode/xml/xml.js
 //= require twitter/typeahead
 //= require jquery.minicolors
 //= require wallaby/auto_select

data/app/assets/javascripts/wallaby/setup.js.erb

@@ -1,60 +1,70 @@
-window.readyPrefix = function readyPrefix(eventName) {
-  return '<%= Wallaby.configuration.features.turbolinks_enabled ? "turbolinks:load" : "ready" %>' + eventName;
-}
+/* global jQuery */
 
-jQuery(document).off(readyPrefix('.wallaby')).on(readyPrefix('.wallaby'), function () {
+(function (jQuery) {
   'use strict';
 
-  jQuery('[data-toggle="tooltip"]').tooltip({ container:'body' })
-  jQuery('#imodal').on('show.bs.modal', function (event) {
-    var $button = jQuery(event.relatedTarget),
-        $this = jQuery(this);
-    $this.find('.modal-title').html($button.siblings('.modaler__title').html());
-    $this.find('.modal-body').html($button.siblings('.modaler__body').html());
-  })
+  window.readyPrefix = function readyPrefix(eventName) {
+    return '<%= Wallaby.configuration.features.turbolinks_enabled ? "turbolinks:load" : "ready" %>' + eventName;
+  }
 
-  jQuery('.index').each(function() {
-    jQuery('.query', this).each(function () {
-      var $this = jQuery(this);
-      jQuery('input:visible', this).on('focus.modifier', function () {
-        $this.addClass('query--focus');
-      }).on('blur', function () {
-        $this.removeClass('query--focus');
-      })
-    })
+  jQuery(document).off(readyPrefix('.wallaby')).on(readyPrefix('.wallaby'), function () {
+    'use strict';
 
-    jQuery('.resources').each(function () {
-      var $this = jQuery(this);
+    // for tooltip
+    jQuery('[data-toggle="tooltip"]').tooltip({ container: 'body' })
 
-      // let's clone the actions, just for styling
-      jQuery('.resources__data', this).each(function () {
-        var $actions_table = jQuery('<table></table>').addClass('resources__actions'),
-            $thead = jQuery('<thead><tr><th>&nbsp;</th></tr></thead>'),
-            $tbody = jQuery('<tbody></tbody>'),
-            $tr = jQuery('<tr></tr>');
+    // for modal
+    jQuery('#imodal').on('show.bs.modal', function (event) {
+      var $button = jQuery(event.relatedTarget),
+          $this = jQuery(this);
+      $this.find('.modal-title').html($button.siblings('.modaler__title').html());
+      $this.find('.modal-body').html($button.siblings('.modaler__body').html());
+    })
 
-        jQuery('.resource__actions', this).each(function () {
-          $tbody.append($tr.clone().append(jQuery(this).clone()));
+    jQuery('.index').each(function() {
+      // add styling for query input box
+      jQuery('.query', this).each(function () {
+        var $this = jQuery(this);
+        jQuery('input:visible', this).on('focus.modifier', function () {
+          $this.addClass('query--focus');
+        }).on('blur', function () {
+          $this.removeClass('query--focus');
         })
-
-        $actions_table.append($thead, $tbody);
-        jQuery('> section', $this).append($actions_table);
       })
 
-      // to show double arrows
-      jQuery('.resources__container').on('scroll', function () {
-        var $container = jQuery(this),
-            $th = jQuery('.resources__actions thead th', $this),
-            $data_table = jQuery('.resources__data', $this);
+      jQuery('.resources').each(function () {
+        var $this = jQuery(this);
+
+        // let's clone the actions, just for styling
+        jQuery('.resources__data', this).each(function () {
+          var $actions_table = jQuery('<table></table>').addClass('resources__actions'),
+              $thead = jQuery('<thead><tr><th><span>&nbsp;</span></th></tr></thead>'),
+              $tbody = jQuery('<tbody></tbody>'),
+              $tr = jQuery('<tr></tr>');
+
+          jQuery('.resource__actions', this).each(function () {
+            $tbody.append($tr.clone().append(jQuery(this).clone()));
+          })
 
-        $th.toggleClass('resources--backward', $container.scrollLeft() > 0);
-        $th.toggleClass('resources--forward', $container.scrollLeft() + $container.width() < $data_table.width());
-      }).trigger('scroll');
+          $actions_table.append($thead, $tbody);
+          jQuery('> section', $this).append($actions_table);
+        })
+
+        // to show double arrows
+        jQuery('.resources__container').on('scroll', function () {
+          var $container = jQuery(this),
+              $th = jQuery('.resources__actions thead th', $this),
+              $data_table = jQuery('.resources__data', $this);
+
+          $th.toggleClass('resources--backward', $container.scrollLeft() > 0);
+          $th.toggleClass('resources--forward', $container.scrollLeft() + $container.width() < $data_table.width());
+        }).trigger('scroll');
+      })
     })
-  })
 
-  if (CodeMirror) {
-    CodeMirror.defaults.theme = "mdn-like";
-    CodeMirror.defaults.lineNumbers = true;
-  }
-})
+    if (CodeMirror) {
+      CodeMirror.defaults.theme = "mdn-like";
+      CodeMirror.defaults.lineNumbers = true;
+    }
+  })
+})(jQuery);

data/app/assets/stylesheets/wallaby/base.scss

@@ -2,15 +2,15 @@
 // NOTE: "bootstrap-sprockets" must be imported
 // before "bootstrap" and "bootstrap/variables"
 @import 'base/vars';
-@import "bootstrap-sprockets";
-@import "bootstrap";
-@import 'bootstrap-datetimepicker';
+@import 'bootstrap';
 @import "font-awesome-sprockets";
 @import "font-awesome";
-@import "jquery.minicolors";
-@import 'summernote';
-@import 'codemirror';
-@import 'codemirror/themes/mdn-like';
+@import 'tempusdominus-bootstrap-4';
+@import 'jquery.minicolors';
+@import "summernote-bs4";
+@import 'codemirror/5.49.2/lib/codemirror';
+@import 'codemirror/5.49.2/theme/mdn-like';
+@import 'base/functions';
 @import 'base/mixins';
 @import 'base/layout';
 @import 'components/text';

data/app/assets/stylesheets/wallaby/base/_functions.scss

@@ -0,0 +1,34 @@
+@function fa-content($fa-var) {
+  // Make sure FA value is wrapped in quotes
+  @return unquote("\"#{ $fa-var }\"");
+}
+
+@if variable-exists(fa-var-pencil) {
+  // FontAwesome 4
+  $fa-var-map: (
+    pencil-alt: $fa-var-pencil,
+    times: $fa-var-remove,
+    sort-up: $fa-var-sort-asc,
+    sort-down: $fa-var-sort-desc,
+  ) !global;
+  $fa-class-map: (
+    pencil-alt: "fa-pencil",
+    times: "fa-remove",
+    sort-up: "fa-sort-asc",
+    sort-down: "fa-sort-desc",
+  ) !global;
+} @else {
+  // FontAwesome 5
+  $fa-var-map: (
+    pencil-alt: $fa-var-pencil-alt,
+    times: $fa-var-times,
+    sort-up: $fa-var-sort-up,
+    sort-down: $fa-var-sort-down,
+  ) !global;
+  $fa-class-map: (
+    pencil-alt: "fa-pencil-alt",
+    times: "fa-times",
+    sort-up: "fa-sort-up",
+    sort-down: "fa-sort-down",
+  ) !global;
+}

data/app/assets/stylesheets/wallaby/base/_layout.scss

@@ -2,11 +2,6 @@ body {
   background-color: $background-color;
   color: $font-color;
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
-  padding-top: 142px;
-
-  &.index {
-    padding-top: 161px;
-  }
 
   small {
     font-size: 95%;
@@ -24,31 +19,37 @@ body {
 }
 
 header {
-  .container-fluid {
-    padding-left: 10px;
-    padding-right: 10px;
-  }
+  @extend .fixed-top;
 
   nav.navbar {
-    @extend .navbar-default, .navbar-fixed-top;
     background-color: white;
     box-shadow: 0 0 12px rgba(0, 0, 0, 0.175);
+    position: relative;
 
-    img.user-portrait {
-      border-radius: 3px;
-      height: 30px;
-      margin: -5px 0;
-      width: 30px;
-    }
+    span.user__portrait {
+      display: inline-block;
+      height: 17px;
 
-    i.user-portrait {
-      font-size: 20px;
-      vertical-align: bottom;
-    }
-  }
+      .user, .fa-user {
+        @extend .d-md-none, .d-lg-block;
+      }
 
-  .navbar-header {
-    position: relative;
+      .user__text {
+        @extend .d-none, .d-md-block, .d-lg-none;
+      }
+
+      img.user {
+        border-radius: 3px;
+        height: 30px;
+        margin-top: -5px;
+        width: 30px;
+      }
+
+      i.fa-user {
+        font-size: 15px;
+        vertical-align: bottom;
+      }
+    }
 
     a.navbar-brand {
       color: $light-red-color;
@@ -56,30 +57,30 @@ header {
         color: $default-red-color;
       }
     }
+  }
 
-    button.navbar-toggle {
-      border: none;
-      float: none;
-      line-height: 16px;
-      margin-top: -18px;
-      padding: 8px 9px;
-      position: absolute;
-      right: 0;
-      top: 50%;
-
-      &:hover, &:focus {
-        background-color: #444;
-        .fa-bars {
-          color: white;
-          font-size: 20px;
-        }
-      }
+  button.navbar-toggle {
+    border: none;
+    float: none;
+    line-height: 16px;
+    margin-top: -18px;
+    padding: 8px 9px;
+    position: absolute;
+    right: 0;
+    top: 50%;
 
+    &:hover, &:focus {
+      background-color: #444;
       .fa-bars {
-        color: $font-color;
+        color: white;
         font-size: 20px;
       }
     }
+
+    .fa-bars {
+      color: $font-color;
+      font-size: 20px;
+    }
   }
 
   #top-menu {
@@ -89,8 +90,7 @@ header {
           display: block;
           position: inherit;
           margin-top: 0;
-          padding-left: 0;
-          padding-top: 0;
+          padding: 0;
           border: none;
           box-shadow: none;
 
@@ -102,7 +102,7 @@ header {
               position: absolute;
               left: 30px;
               top: 50%;
-              margin-top: -7px;
+              margin-top: -5px;
             }
 
             a {
@@ -116,7 +116,7 @@ header {
 }
 
 main {
-  margin: 0 10px;
+  margin: 159px 10px 0;
 
   section {
     font-size: 12px;
@@ -130,11 +130,16 @@ main {
 
   .resources, .resource {
     &__container {
-      overflow: auto;
       background-color: $white;
     }
   }
 
+  .resources {
+    &__container {
+      overflow: auto;
+    }
+  }
+
   .resources__header, .resource__header {
     background-color: $background-color;
     border-bottom: none;
@@ -143,8 +148,8 @@ main {
     padding: 11px 0 0;
     position: fixed;
     right: 0;
-    top: 51px;
-    z-index: 10;
+    top: 49px;
+    z-index: 510;
 
     h1 {
       color: $default-primary-color;
@@ -232,7 +237,7 @@ main {
       }
 
       &__update {
-        @extend .fa-pencil;
+        @include fa-extend('pencil-alt', false);
         background-color: $light-yellow-color;
 
         &:hover {
@@ -241,7 +246,7 @@ main {
       }
 
       &__destroy {
-        @extend .fa-remove;
+        @include fa-extend('times', false);
         background-color: $light-red-color;
 
         &:hover {