mumuki-styles 1.18.2 → 1.19.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: da2d397ee81397616da966377be154ccb61cf7a20311caeb101a0661c49c5447
-  data.tar.gz: 4eb89919aa62b780da7a10a1a0dba46f18eab59b957f925f237ec227a9ec56f0
+  metadata.gz: 2f15207de209d233bdc08d0b9c26b1848dd83989bb572f72817eae84a12d37fb
+  data.tar.gz: dd1584f36759cfe96b66b2cdff79032ee21c27b73c5ffca7ad9ad8fc3c81b0fb
 SHA512:
-  metadata.gz: a2c204b993af3e457960db1b4428b1c137e16ebdb71cbb7490bd7524f176a98a8e6c9962e1c3bc2ce5cbe5540f0bc120fc8c78f8b41ef6e835a6e55a36c4369e
-  data.tar.gz: f6d6a6304a1985874f49cdfc9e9557fe6dc6b752ead601dd7e15a50808e9f033ac4b5f1a395450e34872e4c056082075e15b994cc97661b652d406943a4c00f3
+  metadata.gz: 352fe1f7a4e956de30d9063ca96e2a1199fecc0da8d33b5e1ddbe65996e60ba4e675ec48b779999abdafd3fd487b30dc92f602c2b5d7c615c0cd3ed0c8659529
+  data.tar.gz: ed6488862608cbaf54cf55c741b6f556fa1cff8da583946435c318a096ad7b4e1023b6a59af637656ecbcdc4d348ae8c7dd6f7f42ae9ab9b0127ba143f221eb9

data/app/assets/javascripts/mumuki-styles.js

@@ -12775,69 +12775,69 @@ mumuki.load(function () {
 
 mumuki.load(function () {
 
-  var C = 10;
-  var BORDER = 4;
+  let C = 10;
+  const BORDER = 4;
 
-  var availableDirections = {
+  const availableDirections = {
     up: function ($entity, $column) {
-      var x1 = $entity.from.position().left + $entity.from.width() + BORDER;
-      var y1 = $column.from.position().top + $column.from.height() / 2 + 5;
-      var x2 = $entity.to.position().left + $entity.to.width() + BORDER;
-      var y2 = $column.to.position().top + $column.to.height() / 2 + 5;
+      const x1 = $entity.from.position().left + $entity.from.width() + BORDER;
+      const y1 = $column.from.position().top + $column.from.height() / 2 + 5;
+      const x2 = $entity.to.position().left + $entity.to.width() + BORDER;
+      const y2 = $column.to.position().top + $column.to.height() / 2 + 5;
       return { x1: x1, x2: x2, y1: y1, y2: y2, mi: Math.max(x1, x2) + C * 2, dx1: C, dx2: C };
     },
     down: function ($entity, $column) {
-      var x1 = $entity.from.position().left + $entity.from.width() + BORDER;
-      var y1 = $column.from.position().top + $column.from.height() / 2 + 5;
-      var x2 = $entity.to.position().left + $entity.to.width() + BORDER;
-      var y2 = $column.to.position().top + $column.to.height() / 2 + 5;
+      const x1 = $entity.from.position().left + $entity.from.width() + BORDER;
+      const y1 = $column.from.position().top + $column.from.height() / 2 + 5;
+      const x2 = $entity.to.position().left + $entity.to.width() + BORDER;
+      const y2 = $column.to.position().top + $column.to.height() / 2 + 5;
       return { x1: x1, x2: x2, y1: y1, y2: y2, mi: Math.max(x1, x2) + C * 2, dx1: C, dx2: C };
     },
     left: function ($entity, $column) {
-      var x1 = $entity.from.position().left;
-      var y1 = $column.from.position().top + $column.from.height() / 2 + 5;
-      var x2 = $entity.to.position().left + $entity.to.width() + BORDER;
-      var y2 = $column.to.position().top + $column.to.height() / 2 + 5;
+      const x1 = $entity.from.position().left;
+      const y1 = $column.from.position().top + $column.from.height() / 2 + 5;
+      const x2 = $entity.to.position().left + $entity.to.width() + BORDER;
+      const y2 = $column.to.position().top + $column.to.height() / 2 + 5;
       return { x1: x1, x2: x2, y1: y1, y2: y2, mi: (x1 + x2) / 2, dx1: -C, dx2: C };
     },
     right: function ($entity, $column) {
-      var x1 = $entity.from.position().left + $entity.from.width() + BORDER;
-      var y1 = $column.from.position().top + $column.from.height() / 2 + 5;
-      var x2 = $entity.to.position().left;
-      var y2 = $column.to.position().top + $column.to.height() / 2 + 5;
+      const x1 = $entity.from.position().left + $entity.from.width() + BORDER;
+      const y1 = $column.from.position().top + $column.from.height() / 2 + 5;
+      const x2 = $entity.to.position().left;
+      const y2 = $column.to.position().top + $column.to.height() / 2 + 5;
       return { x1: x1, x2: x2, y1: y1, y2: y2, mi: (x1 + x2) / 2, dx1: C, dx2: -C };
     },
     up_left: function ($entity, $column) {
-      var x1 = $entity.from.position().left;
-      var y1 = $column.from.position().top + $column.from.height() / 2 + 5;
-      var x2 = $entity.to.position().left + $entity.to.width() + BORDER;
-      var y2 = $column.to.position().top + $column.to.height() / 2 + 5;
+      const x1 = $entity.from.position().left;
+      const y1 = $column.from.position().top + $column.from.height() / 2 + 5;
+      const x2 = $entity.to.position().left + $entity.to.width() + BORDER;
+      const y2 = $column.to.position().top + $column.to.height() / 2 + 5;
       return { x1: x1, x2: x2, y1: y1, y2: y2, mi: (x1 + x2) / 2, dx1: -C, dx2: C };
     },
     up_right: function ($entity, $column) {
-      var x1 = $entity.from.position().left + $entity.from.width() + BORDER;
-      var y1 = $column.from.position().top + $column.from.height() / 2 + 5;
-      var x2 = $entity.to.position().left;
-      var y2 = $column.to.position().top + $column.to.height() / 2 + 5;
+      const x1 = $entity.from.position().left + $entity.from.width() + BORDER;
+      const y1 = $column.from.position().top + $column.from.height() / 2 + 5;
+      const x2 = $entity.to.position().left;
+      const y2 = $column.to.position().top + $column.to.height() / 2 + 5;
       return { x1: x1, x2: x2, y1: y1, y2: y2, mi: (x1 + x2) / 2, dx1: C, dx2: -C };
     },
     down_left: function ($entity, $column) {
-      var x1 = $entity.from.position().left;
-      var y1 = $column.from.position().top + $column.from.height() / 2 + 5;
-      var x2 = $entity.to.position().left + $entity.to.width() + BORDER;
-      var y2 = $column.to.position().top + $column.to.height() / 2 + 5;
+      const x1 = $entity.from.position().left;
+      const y1 = $column.from.position().top + $column.from.height() / 2 + 5;
+      const x2 = $entity.to.position().left + $entity.to.width() + BORDER;
+      const y2 = $column.to.position().top + $column.to.height() / 2 + 5;
       return { x1: x1, x2: x2, y1: y1, y2: y2, mi: (x1 + x2) / 2, dx1: -C, dx2: C };
     },
     down_right: function ($entity, $column) {
-      var x1 = $entity.from.position().left + $entity.from.width() + BORDER;
-      var y1 = $column.from.position().top + $column.from.height() / 2 + 5;
-      var x2 = $entity.to.position().left;
-      var y2 = $column.to.position().top + $column.to.height() / 2 + 5;
+      const x1 = $entity.from.position().left + $entity.from.width() + BORDER;
+      const y1 = $column.from.position().top + $column.from.height() / 2 + 5;
+      const x2 = $entity.to.position().left;
+      const y2 = $column.to.position().top + $column.to.height() / 2 + 5;
       return { x1: x1, x2: x2, y1: y1, y2: y2, mi: (x1 + x2) / 2, dx1: C, dx2: -C };
     },
-  }
+  };
 
-  var connectors = {
+  const connectors = {
     one_to_one: function (points) {
       return [
         svgLine(points.x1 + points.dx1, points.x1 + points.dx1, points.y1 - C, points.y1 + C), // | from
@@ -12866,7 +12866,7 @@ mumuki.load(function () {
         svgLine(points.x2, points.x2 + points.dx2, points.y2 + C, points.y2),  //                  / to  many
       ].join('');
     }
-  }
+  };
 
   function entityID(entity, index) {
     return 'mu-erd-' + index + '-' + entity.toLowerCase().replace(/[_]/g, '-');
@@ -12881,8 +12881,8 @@ mumuki.load(function () {
   }
 
   function generateEntityColumns(entity, index) {
-    var columns = entity.columns || [];
-    var html = '';
+    const columns = entity.columns || [];
+    let html = '';
     columns.forEach(function (column) {
       html += [
         '<li id="', columnID(entity.name, column.name, index), '" class="mu-erd-entity-column">',
@@ -12894,19 +12894,19 @@ mumuki.load(function () {
         '  <span class="mu-erd-entity-column-type">', column.type, '</span>',
         '</li>'
       ].join('');
-    })
+    });
     return html;
   }
 
   function appendEntities($diagram, entities, index) {
     entities.forEach(function (entity) {
-      var $entity = $([
+      const $entity = $([
         '<div id="', entityID(entity.name, index), '" class="mu-erd-entity">',
         '  <div class="mu-erd-entity-name">',
-              entity.name,
+        entity.name,
         '  </div>',
         '  <ul class="mu-erd-entity-columns">',
-              generateEntityColumns(entity, index),
+        generateEntityColumns(entity, index),
         '  </ul>',
         '</div>',
       ].join(''));
@@ -12915,11 +12915,15 @@ mumuki.load(function () {
   }
 
   function drawColumnFK(entity, index, column) {
-    return drawFK(entity, column, column.fk, index);
+    try {
+      return drawFK(entity, column, column.fk, index);
+    } catch (e) {
+      console.warn("An error occurred when drawing foreign keys for entity", entity, column, column.fk)
+    }
   }
 
   function getDirection($entityFrom, $entityTo) {
-    var direction = ''
+    let direction = '';
     direction += $entityFrom.position().top > ($entityTo.position().top + $entityTo.height()) ? 'down' : '';
     direction += $entityTo.position().top > ($entityFrom.position().top + $entityFrom.height()) ? 'up' : '';
     direction += ' ';
@@ -12931,16 +12935,16 @@ mumuki.load(function () {
 
   function drawFK(entity, column, fk, index) {
     if (!fk) return '';
-    var $entity = {
+    const $entity = {
       from: $('#' + entityID(entity.name, index)),
       to: $('#' + entityID(fk.to.entity, index))
-    }
-    var $column = {
+    };
+    const $column = {
       from: $('#' + columnID(entity.name, column.name, index)),
       to: $('#' + columnID(fk.to.entity, fk.to.column, index))
-    }
-    var direction = getDirection($entity.from, $entity.to);
-    var points = getPointsFrom(direction, $entity, $column);
+    };
+    const direction = getDirection($entity.from, $entity.to);
+    const points = getPointsFrom(direction, $entity, $column);
     return [
       svgLine(points.x1, points.mi, points.y1, points.y1),
       svgLine(points.mi, points.mi, points.y1, points.y2),
@@ -12953,7 +12957,7 @@ mumuki.load(function () {
   }
 
   function drawConnectorLines(entity, index) {
-    var columns = entity.columns || [];
+    const columns = entity.columns || [];
     return columns.map(drawColumnFK.bind(this, entity, index)).join('');
   }
 
@@ -12963,19 +12967,19 @@ mumuki.load(function () {
 
   function appendConnectors($diagram, entities, index) {
     entities.forEach(function (entity) {
-      var $svg = $(getSVGFor(entity, index));
+      const $svg = $(getSVGFor(entity, index));
       $diagram.append($svg);
     });
   }
 
-  function svgLine(x1, x2, y1 , y2) {
+  function svgLine(x1, x2, y1, y2) {
     return ['<line x1="', x1, '" x2="', x2, '" y1="', y1, '" y2="', y2, '" stroke="black" stroke-width="1"/>'].join('');
   }
 
   function mapEntityColumns(columnsObject) {
-    var columns = [];
-    for (var key in columnsObject) {
-      var column = columnsObject[key];
+    const columns = [];
+    for (let key in columnsObject) {
+      const column = columnsObject[key];
       column.name = key;
       columns.push(column);
     }
@@ -12983,9 +12987,9 @@ mumuki.load(function () {
   }
 
   function mapEntities(entitiesObject) {
-    var entities = [];
-    for (var key in entitiesObject) {
-      var entity = {};
+    const entities = [];
+    for (let key in entitiesObject) {
+      const entity = {};
       entity.name = key;
       entity.columns = mapEntityColumns(entitiesObject[key]);
       entities.push(entity);
@@ -12994,21 +12998,28 @@ mumuki.load(function () {
   }
 
   $.fn.renderERD = function () {
-    var self = this;
+    const self = this;
     self.empty();
     self.each(function (i) {
-      var $diagram = $(self[i]);
-      var entities = mapEntities($diagram.data('entities'));
+      //Don't draw if hidden
+      if ((self[i].offsetParent === null)) return;
+      const $diagram = $(self[i]);
+
+      const entities = mapEntities($diagram.data('entities'));
       appendEntities($diagram, entities, i);
       appendConnectors($diagram, entities, i);
     });
     return self;
-  }
+  };
 
   mumuki.resize(function () {
     $('.mu-erd').renderERD();
   });
 
+  //Redraw on bootstrap tab change event
+  $('a[data-toggle="tab"]').on('shown.bs.tab', function () {
+    $('.mu-erd').renderERD()
+  });
 });
 
 mumuki.load(function () {
@@ -13210,7 +13221,7 @@ mumuki.load(function () {
       copy: 'Copiar',
       copied: 'Copiado'
     },
-  }
+  };
 
   function getCopiedText() {
     var lang = (mumuki.locale || navigator.language || navigator.userLanguage || 'en').split('-')[0];
@@ -13289,7 +13300,7 @@ mumuki.load(function () {
     });
 
     return self;
-  }
+  };
 
   mumuki.resize(function () {
     $('pre').renderCopyPaste();

data/app/assets/stylesheets/css/mumuki-styles.css

@@ -9325,6 +9325,81 @@ pre code {
     .new-message-modal .mu-message-textarea:focus {
       outline: -webkit-focus-ring-color none 0; }
 
+.mu-multiple-scenarios {
+  display: flex;
+  flex-direction: column; }
+  .mu-multiple-scenarios .mu-scenarios {
+    position: relative;
+    flex-grow: 9;
+    min-height: 90%;
+    overflow: hidden; }
+    .mu-multiple-scenarios .mu-scenarios a.mu-scenario-control {
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      display: -webkit-box;
+      display: -ms-flexbox;
+      display: flex;
+      -webkit-box-align: center;
+      -ms-flex-align: center;
+      align-items: center;
+      -webkit-box-pack: center;
+      -ms-flex-pack: center;
+      justify-content: center;
+      width: 15%;
+      text-align: center;
+      opacity: 0.8;
+      color: #0B465D;
+      text-decoration: none; }
+      .mu-multiple-scenarios .mu-scenarios a.mu-scenario-control i {
+        cursor: pointer;
+        padding: 15px; }
+      .mu-multiple-scenarios .mu-scenarios a.mu-scenario-control.previous {
+        left: 0; }
+      .mu-multiple-scenarios .mu-scenarios a.mu-scenario-control.next {
+        right: 0; }
+  .mu-multiple-scenarios .indicators {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    justify-content: center;
+    padding-left: 0;
+    margin-right: 15%;
+    margin-left: 15%;
+    list-style: none;
+    margin-bottom: 0; }
+    .mu-multiple-scenarios .indicators li {
+      position: relative;
+      -webkit-box-flex: 0;
+      -ms-flex: 0 1 auto;
+      flex: 0 1 auto;
+      margin: 10px 5px;
+      opacity: 0.5;
+      color: #0B465D;
+      cursor: pointer; }
+      .mu-multiple-scenarios .indicators li.jump {
+        -webkit-animation: jump 1s ease-in-out infinite alternate;
+        -moz-animation: jump 1s ease-in-out infinite alternate;
+        animation: jump 1s ease-in-out infinite alternate; }
+    .mu-multiple-scenarios .indicators > li:only-child {
+      display: none; }
+    .mu-multiple-scenarios .indicators li.active {
+      opacity: 1; }
+
+@keyframes jump {
+  0% {
+    transform: none; }
+  50% {
+    transform: translateY(-0.5em); } }
+    .mu-multiple-scenarios .indicators .failed {
+      color: #d9534f; }
+    .mu-multiple-scenarios .indicators .passed {
+      color: #5cb85c; }
+  .mu-multiple-scenarios .mu-scenario:not(.active) {
+    display: none !important; }
+
 .mu-navbar {
   display: flex;
   flex-flow: row;
@@ -9398,6 +9473,9 @@ pre code {
       object-fit: cover;
       cursor: pointer; }
 
+.da-mumuki {
+  text-decoration: none; }
+
 .pointer {
   cursor: pointer; }
 
@@ -9784,7 +9862,8 @@ pre code {
 pre {
   position: relative;
   border: 2px solid #cfd9db;
-  border-width: 1px; }
+  border-width: 1px;
+  padding-top: 32px; }
   pre .mu-clipboard {
     font-size: 85%;
     cursor: pointer;

data/app/assets/stylesheets/scss/_modules.scss

@@ -6,3 +6,4 @@
 @import 'modules/highlight';
 @import 'modules/notification';
 @import 'modules/new_message';
+@import 'modules/multiple_scenarios';

data/app/assets/stylesheets/scss/_navbar.scss

@@ -97,3 +97,7 @@ $avatar-size: 40px;
   }
 
 }
+
+.da-mumuki {
+  text-decoration: none;
+}

data/app/assets/stylesheets/scss/components/_mu-pre-copy-paste.scss

@@ -5,6 +5,7 @@ pre {
   position: relative;
   border: $mu-component-border;
   border-width: 1px;
+  padding-top: 32px;
 
   .mu-clipboard {
     font-size: 85%;

data/app/assets/stylesheets/scss/modules/_multiple_scenarios.scss

@@ -0,0 +1,106 @@
+$statuses: (
+  failed: $brand-danger,
+  passed: $brand-success
+);
+
+.mu-multiple-scenarios {
+  display: flex;
+  flex-direction: column;
+  .mu-scenarios {
+    position: relative;
+    flex-grow: 9;
+    min-height: 90%;
+    overflow: hidden;
+
+    a.mu-scenario-control {
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      display: -webkit-box;
+      display: -ms-flexbox;
+      display: flex;
+      -webkit-box-align: center;
+      -ms-flex-align: center;
+      align-items: center;
+      -webkit-box-pack: center;
+      -ms-flex-pack: center;
+      justify-content: center;
+      width: 15%;
+      text-align: center;
+      opacity: 0.8;
+      color: $brand_primary;
+      text-decoration: none;
+
+      i {
+        cursor: pointer;
+        padding: 15px;
+      }
+      
+      &.previous {
+        left: 0;
+      }
+
+      &.next {
+        right: 0;
+      }
+    }
+  }
+
+  .indicators {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    justify-content: center;
+    padding-left: 0;
+    margin-right: 15%;
+    margin-left: 15%;
+    list-style: none;
+    margin-bottom: 0;
+    li {
+      position: relative;
+      -webkit-box-flex: 0;
+      -ms-flex: 0 1 auto;
+      flex: 0 1 auto;
+      margin: 10px 5px;
+      opacity: 0.5;
+      color: $brand-primary;
+      cursor: pointer;
+      &.jump {
+        -webkit-animation: jump 1s ease-in-out infinite alternate;
+        -moz-animation: jump 1s ease-in-out infinite alternate;
+        animation: jump 1s ease-in-out infinite alternate;
+      }
+    }
+
+    & > li:only-child {
+      display: none;
+    }
+
+    li.active {
+      opacity: 1;
+    }
+
+    @keyframes jump {
+      0% {
+        transform: none;
+      }
+      50% {
+        transform: translateY(-0.5em);
+      }
+    }
+
+    @each $status, $color in $statuses {
+      .#{$status} {
+        color: $color;
+      }
+    }
+  }
+  .mu-scenario {
+    &:not(.active) {
+      display: none !important;
+    }
+  }
+
+}

data/lib/mumuki/styles/version.rb

@@ -1,5 +1,5 @@
 module Mumuki
   module Styles
-    VERSION = "1.18.2"
+    VERSION = "1.19.0"
   end
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: mumuki-styles
 version: !ruby/object:Gem::Version
-  version: 1.18.2
+  version: 1.19.0
 platform: ruby
 authors:
 - Federico Scarpa
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2018-08-31 00:00:00.000000000 Z
+date: 2019-02-28 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: bundler
@@ -125,6 +125,7 @@ files:
 - app/assets/stylesheets/scss/modules/_conversation.scss
 - app/assets/stylesheets/scss/modules/_follow_us.scss
 - app/assets/stylesheets/scss/modules/_highlight.scss
+- app/assets/stylesheets/scss/modules/_multiple_scenarios.scss
 - app/assets/stylesheets/scss/modules/_new_message.scss
 - app/assets/stylesheets/scss/modules/_notification.scss
 - app/assets/stylesheets/scss/mumuki-styles.scss
@@ -235,8 +236,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubyforge_project: 
-rubygems_version: 2.7.7
+rubygems_version: 3.0.2
 signing_key: 
 specification_version: 4
 summary: Mumuki Styles