kraken-mobile 1.0.1 → 1.0.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 399b50618849eced648c4b30c302d1e18f391dbe
-  data.tar.gz: 5f5ab7721e8a6989e5a0c0a8f67c627cdf190f96
+  metadata.gz: bc931cd463cf275dd15848f6f5751461275b72c8
+  data.tar.gz: 83c25030dcf11cd2bd403b2f31b76948c73fea07
 SHA512:
-  metadata.gz: 7ea770b4431e9c528ae6f86408b085ec2afaa99ae8809629d1c02b83060e94dca1aaa51e04e86347106226f3ea6220527023a9b87263e2cc94006d59127f962b
-  data.tar.gz: cd9924ac842fbce5e3f0f482f215c4d539249c89d0432e5872db50c5764f7e2acbde99465f64f6fb829db25b89def174cdd52ab4f1507b4e5bd90327ec764757
+  metadata.gz: 99bf9ad2a91215798445e26e16fe0377bd8ba6dc0cea908166592c23819362444e082120562743663e299004df7918667cec8454ff375778b79f5e354b7fc5b5
+  data.tar.gz: e4d9af2856eef33da3d740a1cbf642492383490947a00bae2c765f13553efa863c8739fdd95bb571e38b279c456bf67cfd59238c0c69da27e7c7a872c848fb39

data/README.md

@@ -1,7 +1,5 @@
 <p align="center">
-  <a href="https://getbootstrap.com/">
-    <img src="https://raw.githubusercontent.com/ravelinx22/KrakenMobile/master/reporter/assets/images/kraken.png" alt="Bootstrap logo" width="140" height="193">
-  </a>
+    <img src="https://raw.githubusercontent.com/ravelinx22/KrakenMobile/master/reporter/assets/images/kraken.png" alt="kraken logo" width="140" height="193">
 </p>
 
 <h3 align="center">Kraken Mobile</h3>

data/lib/kraken-mobile/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 # encoding: utf-8
 module KrakenMobile
-  VERSION = "1.0.1"
+  VERSION = "1.0.2"
 end

data/reporter/assets/css/scenario_index.css

@@ -459,3 +459,23 @@ background-color: #E74C3C;
 padding: 50px 0;
 text-align: center;
 }
+
+.step_title {
+  margin-bottom: 10px;
+  white-space:nowrap;
+  overflow-x: hidden;
+  text-overflow: ellipsis;
+}
+
+.step_title_icon {
+  margin-right: 5px;
+}
+
+.not_available {
+  text-align: center;
+  width: 100%;
+}
+
+.step_image {
+  cursor: pointer;
+}

data/reporter/assets/js/sankey.js

@@ -110,11 +110,21 @@
                 return 10;
               })
               .style("fill", e)
+              .style("cursor", function(t) {
+                if(t.image) {
+                  return "pointer";
+                } else {
+                  return "default";
+                }
+              })
               .on("mouseover", function(t) {
                 mouseover(t, i);
               }).on("mouseout", function(t) {
                 mouseout(t, i);
               })
+              .on("click", function(t) {
+                click(t, i);
+              })
             },
             exit: function() {
               this.remove()
@@ -442,7 +452,7 @@ function mouseover(d, contexter) {
   computedHeight = boundingRect.height;
 
   let xPosition = d.x + margins.left + d.dx + 10;
-  let yPosition = margins.top;
+  let yPosition = d.y + d.dy/2;
   let endXPosition = xPosition + computedWidth;
 
   if(endXPosition > width) {
@@ -457,38 +467,50 @@ function mouseover(d, contexter) {
     im.id = "scene" + d.id;
     im.src = "data:image/png;base64," + d.image
     im.onload = function(e) {
-      var w = this.width;
-      var h = this.height;
+      var h = 100;
       var ixPosition = d.x + margins.left + d.dx + 10; // 10 of separation from node
-      var iyPosition = computedHeight + 10; // 10 of separation from label
-      let endiXPosition = ixPosition + w;
-      let endiYPosition = iyPosition + h;
-
-      var i = 1
-      while(w/i > 100 || h/i > 100) {
-        i++;
-      }
-
-      h = h/i;
-      w = w/i;
-
-      endiXPosition = ixPosition + w;
-      endiYPosition = iyPosition + h;
+      var iyPosition = d.y + d.dy/2 + 10; // 10 of separation from label
 
-      if(endiXPosition > width) {
-        ixPosition -= (endiXPosition-width)
-      }
-
-      contexter.base.append("image")
+      image = contexter.base.append("image")
       .data([this])
       .attr("x", ixPosition)
       .attr("y", iyPosition)
+      .attr("height", 100)
+      .attr("width", 50)
+      .style("width", "auto")
       .attr("xlink:href", this.src)
       .attr("transform", null)
       .attr("id", this.id)
       .attr("class", "scene-image")
-      .attr("width", w)
-      .attr("height", h)
+
+      imageBoundingRect = image.node().getBoundingClientRect();
+      computedImageWidth = imageBoundingRect.width;
+      computedImageHeight = imageBoundingRect.height;
+      let endImageXPosition = ixPosition + computedImageWidth;
+      let endImageYPosition = iyPosition + computedImageHeight;
+
+      if(endImageXPosition > width) {
+        ixPosition -= (endImageXPosition-width)
+      }
+
+      if(endImageYPosition > height + margins.bottom) {
+        iyPosition -= (endImageYPosition-(height+margins.bottom))
+      }
+
+      image.attr("x", ixPosition)
+      .attr("y", iyPosition);
+
+      text.attr("y", iyPosition - 10);
+
+      contexter.base.append('rect')
+      .attr('class', 'scene-image')
+      .attr('width', computedImageWidth)
+      .attr('height', computedImageHeight)
+      .attr('fill', 'transparent')
+      .attr('stroke', 'black')
+      .style('opacity', 0.25)
+      .attr("x", ixPosition)
+      .attr("y", iyPosition);
     }
   }
 }
@@ -497,6 +519,16 @@ function mouseout(d, svg) {
   d3.selectAll("[class=\"scene-image\"]").remove();
 }
 
+function click(d, svg) {
+  if(d.image) {
+    var im = new Image();
+    im.src = "data:image/png;base64," + d.image
+    var w = window.open("",'_blank');
+    w.document.write(im.outerHTML);
+    w.document.close();
+  }
+}
+
 function label(node) {
   return node.name.replace(/\s*\(.*?\)$/, '');
 }

data/reporter/index.html.erb

@@ -643,7 +643,8 @@
       }
       devices = Array.from(devicesSet);
       // GRAPH
-      var height = 150*(devices.length-1);
+      let devicesLength = devices.length > 1 ? (devices.length-1) : 1;
+      var height = 150*devicesLength;
       var c20c = d3.scale.category10();
       d3.select("#chart_row" + (i+1))
       .text(jsonObject["name"])

data/reporter/scenario_report.html.erb

@@ -125,9 +125,42 @@
           </div>
         </div>
       </div>
-    </div>
+    </div> <!-- Closes scenario row -->
+
+    <div class="row">
+      <div class="col-md-12 col-sm-12 col-xs-12">
+        <div class="x_panel" style="height: auto;">
+          <div class="x_title">
+            <h2>Screenshots</h2>
+            <div class="clearfix"></div>
+          </div>
+          <div class="x_content">
+            <div class="container">
+              <div class="row">
+                <% f["steps"].each do |s| %>
+                  <div class="col-md-2">
+                    <div class="step_title">
+                      <i class="fa fa-arrow-right step_title_icon"></i>
+                      <%= s["keyword"] %> <%= s["name"] %>
+                    </div>
+                    <% if(s["after"] && s["after"].count > 0 && s["after"].first["embeddings"] && s["after"].first["embeddings"].count > 0) %>
+                      <% step_image = s["after"].first["embeddings"].first["data"] %>
+                      <img src='<%= "data:image/png;base64,#{step_image}" %>' alt="" class="img-responsive step_image" onclick='<%= "openImageNewTab(\"#{step_image}\")" %>'>
+                    <% else %>
+                      <div class="not_available">
+                        NO IMAGE AVAILABLE
+                      </div>
+                    <% end %>
+                  </div>
+                <% end %>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div> <!-- Closes screenshots row -->
+    <% end %>
   </div>
-  <% end %>
 
   <script src="../../assets/js/jquery-3.2.1.min.js" ></script>
   <script src="../../assets/js/bootstrap.min.js"></script>
@@ -136,39 +169,48 @@
   <script src="../../assets/js/dataTables.responsive.min.js"></script>
   <script src="../../assets/js/Chart.min.js"></script>
   <script>
-  $(document).ready(function () {
-    passed_scenarios = parseInt("<%= passed_scenarios(@feature).count %>")
-    failed_scenarios = parseInt("<%= failed_scenarios(@feature).count %>")
+    function openImageNewTab(imageData) {
+      var im = new Image();
+      im.src = "data:image/png;base64," + imageData
+      var w = window.open("",'_blank');
+      w.document.write(im.outerHTML);
+      w.document.close();
+    }
 
-    scenarios_data = [passed_scenarios,failed_scenarios];
-    var scenarioOptions = {
-      legend: false,
-      responsive: false
-    };
+    $(document).ready(function () {
 
-    new Chart(document.getElementById("scenario-chart"), {
-      type: 'doughnut',
-      tooltipFillColor: "rgba(51, 51, 51, 0.55)",
-      data: {
-        labels: [
-          "Passed",
-          "Failed"
-        ],
-        datasets: [{
-          data: scenarios_data,
-          backgroundColor: [
-            "#26B99A",
-            "#E74C3C"
-          ]
-        }]
-      },
-      options: scenarioOptions
-    });
+      passed_scenarios = parseInt("<%= passed_scenarios(@feature).count %>")
+      failed_scenarios = parseInt("<%= failed_scenarios(@feature).count %>")
+
+      scenarios_data = [passed_scenarios,failed_scenarios];
+      var scenarioOptions = {
+        legend: false,
+        responsive: false
+      };
+
+      new Chart(document.getElementById("scenario-chart"), {
+        type: 'doughnut',
+        tooltipFillColor: "rgba(51, 51, 51, 0.55)",
+        data: {
+          labels: [
+            "Passed",
+            "Failed"
+          ],
+          datasets: [{
+            data: scenarios_data,
+            backgroundColor: [
+              "#26B99A",
+              "#E74C3C"
+            ]
+          }]
+        },
+        options: scenarioOptions
+      });
 
-    $('body').tooltip({
-      selector: '[data-toggle="tooltip"]'
+      $('body').tooltip({
+        selector: '[data-toggle="tooltip"]'
+      });
     });
-  });
 </script>
 </body>
 </html>

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: kraken-mobile
 version: !ruby/object:Gem::Version
-  version: 1.0.1
+  version: 1.0.2
 platform: ruby
 authors:
 - William Ravelo M
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2019-05-20 00:00:00.000000000 Z
+date: 2019-05-31 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: cucumber
@@ -142,7 +142,7 @@ files:
 - reporter/feature_report.html.erb
 - reporter/index.html.erb
 - reporter/scenario_report.html.erb
-homepage: https://github.com/ravelinx22/KrakenMobile
+homepage: https://github.com/TheSoftwareDesignLab/KrakenMobile
 licenses:
 - MIT
 metadata: {}