lazy_mobile_tester 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 91a370c3efc9387fc47016c4cd8a95cb13a667d65d8a7f92ebdcd0b09d8e7e9c
+  data.tar.gz: 29f2b0d1e1c2b140aab00e4bdf0c5560a76eec2b7f05dda6b870db553c6c233a
+SHA512:
+  metadata.gz: b0162b5b27538ba298dfb18bbd019374711cb3e66ddd819955f09520e5310c853f8e90509c5edbfea36089e1290c50e6395547fd4e8e063c0d070e867a72afa8
+  data.tar.gz: f911088e71a971d961aaac601a884df5fce983479a7944a0f0fe869201649c488ee3aea6973b779b100f06d7aa5ac4206bdc5fae24971a3c142a26c708dbb029

data/MIT-LICENSE

@@ -0,0 +1,20 @@
+Copyright 2022 Igor Kasyanchuk
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README.md

@@ -0,0 +1,50 @@
+# Lazy Mobile Tester
+
+"Laziness is the mother of progress" :)
+
+We all know that we can use Chrome Dev Tools to check how app looks on a different resolutions.
+
+But opening this tool, clicking, changing resolutions... It's just too many actions. 
+
+I'm as developer want an easy way to check how webpage looks on a different resolutions. With a simple click.
+
+This is why I've created a simple gem which opens webpage in iframe and allows you to change width of it.
+
+## Usage
+
+There are two ways how to use it:
+
+1) with button in top left corner to open page in IFRAME. To do this add in your layout inside body tag:
+
+```erb
+    <%= lazy_mobile_tester_button if defined?(LazyMobileTester) %>
+```
+
+2) add a parameter to any URL `?_lazy=1` and open it. For example - `instead of /users just open /users??_lazy=1`
+
+
+## Installation
+
+Add this line to your application's Gemfile:
+
+```ruby
+gem "lazy_mobile_tester"
+```
+
+And then execute:
+```bash
+$ bundle
+```
+
+## Contributing
+
+You are welcome to contribute.
+
+## TODO
+
+- tests?
+- any other ideas?
+
+## License
+
+The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).

data/Rakefile

@@ -0,0 +1,8 @@
+require "bundler/setup"
+
+APP_RAKEFILE = File.expand_path("test/dummy/Rakefile", __dir__)
+load "rails/tasks/engine.rake"
+
+load "rails/tasks/statistics.rake"
+
+require "bundler/gem_tasks"

data/app/views/lazy_mobile_tester/_toolbar.html.erb

@@ -0,0 +1,188 @@
+<title>Lazy Mobile Tester :)</title>
+
+<style>
+  :root {
+    --toolbar-height: 26px;
+  }
+  body {
+    margin: 0;
+    padding: 0;
+    background: #0f172a;
+    text-align: center;
+    font-family: Arial;
+  }
+
+  #lazy_mobile_tester_iframe {
+    margin: 0;
+    padding: 0;
+    width: 100%;
+    border: 0;
+    height: calc(100vh - var(--toolbar-height) - 10px);
+  }
+
+  #lazy_mobile_tester_panel {
+    margin: 0;
+    padding: 0;
+    padding: 2px 0;
+    width: 100%;
+    background: #334155;
+    height: var(--toolbar-height);
+    color: white;
+  }
+
+  #info {
+    color: white;
+    font-size: 12px;
+  }
+
+  #url {
+    width: 300px;
+  }
+
+  #copied {
+    visibility: hidden;
+    color: lime;
+    font-size: 12px;
+  }
+
+  button {
+    background: rgb(99, 102, 241);
+    color: white;
+    border: 0 none;
+    cursor: pointer;
+  }
+
+  button:disabled {
+    background: #333;
+    color: #999;
+    cursor: auto;
+  }
+
+  #close_button {
+    background: red;
+  }
+
+  input {
+    font-size: 12px;
+  }
+</style>
+
+<script type="module">
+  import { Application, Controller } from "https://unpkg.com/@hotwired/stimulus/dist/stimulus.js"
+  window.Stimulus = Application.start()
+
+  Stimulus.register("toolbar", class extends Controller {
+    static targets = [ "iframe", "rotate_button", "info", "url", "copied" ]
+    static values = { rotated: {type: Boolean, default: false}, w: String, h: String, rotate: {type: Boolean, default: false} }
+
+    connect() {
+      if(localStorage.getItem("rotateValue") !== null && localStorage.getItem("rotatedValue") !== null) {
+        this.rotateValue = localStorage.getItem("rotateValue");
+        this.rotatedValue = localStorage.getItem("rotatedValue");
+      }
+      this.paint();
+    }
+
+    screen({params}) {
+      this.wValue = params.w;
+      this.hValue = params.h;
+      this.rotateValue = params.rotate;
+      this.rotatedValue = false;
+
+      this.storeSize();
+      this.paint();
+    }
+
+    storeSize() {
+      const { w, h } = this.size();
+      localStorage.w = w;
+      localStorage.h = h;
+      localStorage.rotateValue = this.rotateValue;
+      localStorage.rotatedValue = this.rotatedValue;
+    }
+
+    rotate() {
+      this.rotatedValue = !this.rotatedValue;
+      this.storeSize();
+      this.paint();
+    }
+
+    close() {
+      window.location.href = this.iframeTarget.contentWindow.location.href;
+    }
+
+    iframeonload() {
+      this.urlTarget.value = this.iframeTarget.contentWindow.location.href;
+      this.urlTarget.scrollLeft = this.urlTarget.scrollWidth;
+    }
+
+    size() {
+      if (this.rotatedValue && this.rotateValue) {
+        return { "w": this.hValue, "h": this.wValue }
+      } else {
+        return { "w": this.wValue, "h": this.hValue }
+      }
+    }
+
+    copy(event) {
+      if (this.urlTarget.value == "") {
+        return;
+      }
+
+      event.preventDefault()
+      this.urlTarget.select();
+      document.execCommand("copy");
+      this.copiedTarget.style.visibility = "visible";
+      setTimeout(() => {
+        this.copiedTarget.style.visibility = "hidden";
+      }, 800)
+    }
+
+    paint() {
+      const { w, h } = this.size();
+      this.iframeTarget.style.width = (localStorage.getItem("w") === null) ? w : localStorage.w;
+      this.iframeTarget.style.height = (localStorage.getItem("h") === null) ? h : localStorage.h;
+      this.rotate_buttonTarget.disabled = !this.rotateValue;
+
+      const { width, height } = this.iframeTarget.getBoundingClientRect();
+      this.infoTarget.innerHTML = parseInt(width) + "x" + parseInt(height)
+    }
+
+  })
+</script>
+
+<div data-controller="toolbar" id="lazy_mobile_tester">
+  <div id="lazy_mobile_tester_panel">
+    <input type='text' data-toolbar-target="url" id="url" readonly data-action="focus->toolbar#copy"/>
+    <span id="copied" data-toolbar-target="copied">Copied</span>
+    &nbsp;
+    &nbsp;
+    &nbsp;
+    <% LazyMobileTester.resolutions.each do |k, resolution| %>
+      <button data-action="click->toolbar#screen" data-toolbar-w-param="<%= resolution[:w] %>" data-toolbar-h-param="<%= resolution[:h] %>" data-toolbar-rotate-param="<%= resolution[:rotate] %>"><%= k %></button>
+    <% end %>
+    &nbsp;
+    &nbsp;
+    &nbsp;
+    <button data-action="click->toolbar#rotate" data-toolbar-target="rotate_button" disabled>&orarr; Rotate</button>
+    &nbsp;
+    &nbsp;
+    &nbsp;
+    <span data-toolbar-target="info" id="info"></span>
+    <!--
+    &nbsp;
+    &nbsp;
+    &nbsp;
+    URI: <%= @uri %>
+    &nbsp;
+    &nbsp;
+    &nbsp;
+    URL: <%= @url %>
+    -->
+    &nbsp;
+    &nbsp;
+    &nbsp;
+    <button data-action="click->toolbar#close" id="close_button">&cross; Close</button>
+  </div>
+  <iframe data-action="load->toolbar#iframeonload" data-toolbar-target="iframe" id="lazy_mobile_tester_iframe" frameborder="0" seamless="seamless" src="<%= @uri %>"></iframe>
+</div>

data/config/routes.rb

@@ -0,0 +1,2 @@
+Rails.application.routes.draw do
+end

data/lib/lazy_mobile_tester/engine.rb

@@ -0,0 +1,16 @@
+module LazyMobileTester
+  class Engine < ::Rails::Engine
+    isolate_namespace LazyMobileTester
+
+    initializer "lazy_mobile_tester.middleware" do |app|
+      next unless LazyMobileTester.enabled
+      app.middleware.insert_before  ActionDispatch::HostAuthorization, LazyMobileTester::Middleware
+    end
+
+    initializer 'lazy_mobile_tester.helpers' do
+      ActiveSupport.on_load :action_view do
+        include LazyMobileTester::Helper
+      end
+    end
+  end
+end

data/lib/lazy_mobile_tester/helper.rb

@@ -0,0 +1,11 @@
+module LazyMobileTester
+  module Helper
+    IMG = "<img width='16' height='16' src='data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgaGVpZ2h0PSI0NjcuMzgiIGlkPSJzdmczNiIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgNDY3LjM5ODAxIDQ2Ny4zOCIgd2lkdGg9IjQ2Ny4zOTgwMSIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIiB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iIHhtbG5zOmlua3NjYXBlPSJodHRwOi8vd3d3Lmlua3NjYXBlLm9yZy9uYW1lc3BhY2VzL2lua3NjYXBlIiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiIHhtbG5zOnNvZGlwb2RpPSJodHRwOi8vc29kaXBvZGkuc291cmNlZm9yZ2UubmV0L0RURC9zb2RpcG9kaS0wLmR0ZCIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnMgaWQ9ImRlZnM0MCIvPjxnIGlkPSJMY2RfV2l0aF9UYWJsZXRfYW5kX21vYmlsZV9pY29uIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjIuMzAxLC0yMi4zMSkiPjxnIGlkPSJnMzIiPjxwYXRoIGQ9Im0gMjU2LjAwMSwyMi4zMSBjIDEyOS4xMjEsMCAyMzMuNjk4LDEwNC45MTEgMjMzLjY5OCwyMzMuNjkgMCwxMjkuMTEzIC0xMDQuNTc3LDIzMy42OSAtMjMzLjY5OCwyMzMuNjkgLTEyOS4xMTgsMCAtMjMzLjcsLTEwNC41NzcgLTIzMy43LC0yMzMuNjkgMCwtMTI4Ljc3OSAxMDQuNTgyLC0yMzMuNjkgMjMzLjcsLTIzMy42OSB6IiBpZD0icGF0aDQiIHN0eWxlPSJjbGlwLXJ1bGU6ZXZlbm9kZDtmaWxsOiNmZDg0Njk7ZmlsbC1ydWxlOmV2ZW5vZGQiLz48cGF0aCBkPSJtIDQ3Mi41NSwxNjguMjM4IGMgMTEuMDk5LDI3LjIzNyAxNy4xNDksNTYuODIyIDE3LjE0OSw4Ny43NjIgMCwxMjkuMTEzIC0xMDQuNTc3LDIzMy42OSAtMjMzLjY5OCwyMzMuNjkgLTQuMzY2LDAgLTguNDA4LDAgLTEyLjc3NCwtMC4zMjQgTCA5NS4yNzUsMzc1LjAzNSBjIDAsLTM3LjY1OCAtMC4zMzQsLTgwLjAzMSAtMC4zMzQsLTExNy42ODkgMCwtNS4wMzkgNC4wMjcsLTkuMDc2IDguNzQyLC05LjA3NiA1LjcxMiwwIDExLjA5NCwwIDE2LjQ3MiwwIDAsLTQzLjA1IDAsLTg2LjQxNiAwLC0xMjkuOCBsIDI4Ny44NDMsLTMuMDI1IGMgMS42OCwzLjAyNCA2My4yMDYsNTIuNzkzIDY0LjU1Miw1Mi43OTMgeiIgaWQ9InBhdGg2IiBzdHlsZT0iY2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDojZTQ3NzVmO2ZpbGwtcnVsZTpldmVub2RkIi8+PHBhdGggZD0ibSAzMTkuODkzLDM1NS44NjIgaCAtMTE1LjM0IGMgLTQuMzY2LDAgLTcuNzM1LC0zLjM1IC03LjczNSwtNy4zODYgdiAwIGMgMCwtNC4zODEgMy4zNjksLTcuNzMgNy43MzUsLTcuNzMgaCAxMTUuMzQgYyA0LjAzNywwIDcuNzMsMy4zNSA3LjczLDcuNzMgdiAwIGMgMCw0LjAzNyAtMy42OTMsNy4zODYgLTcuNzMsNy4zODYgeiIgaWQ9InBhdGg4IiBzdHlsZT0iY2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDojMzI0YTVlO2ZpbGwtcnVsZTpldmVub2RkIi8+PHJlY3QgaGVpZ2h0PSI0MC4wMjUwMDIiIGlkPSJyZWN0MTAiIHN0eWxlPSJjbGlwLXJ1bGU6ZXZlbm9kZDtmaWxsOiMyMTMxM2U7ZmlsbC1ydWxlOmV2ZW5vZGQiIHdpZHRoPSI2MS44NzMwMDEiIHg9IjIzMS4xMTciIHk9IjMwMC43MjEwMSIvPjxyZWN0IGhlaWdodD0iMjAxLjA4IiBpZD0icmVjdDEyIiBzdHlsZT0iY2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDojMzI0YTVlO2ZpbGwtcnVsZTpldmVub2RkIiB3aWR0aD0iMjkxLjU0MDk5IiB4PSIxMTYuNDU3IiB5PSIxMTUuNDQ0Ii8+PHJlY3QgaGVpZ2h0PSIxNjAuNzEyMDEiIGlkPSJyZWN0MTQiIHN0eWxlPSJjbGlwLXJ1bGU6ZXZlbm9kZDtmaWxsOiNmZmZmZmY7ZmlsbC1ydWxlOmV2ZW5vZGQiIHdpZHRoPSIyNTEuMTgyMDEiIHg9IjEzNi42MzIiIHk9IjEzNS42MzgiLz48cGF0aCBkPSJtIDQxNS4wNDEsMjU5LjM2OSBoIC02My44ODUgdiAxMDAuNTMgaCA2My44ODUgeiBNIDM4Ny40NzksMzY3LjYzIGMgMCwtMi42ODIgLTIuMDE0LC00LjY5NSAtNC4zNzEsLTQuNjk1IC0yLjM1NywwIC00LjM3MSwyLjAxNCAtNC4zNzEsNC42OTUgMCwyLjM1NyAyLjAxNCw0LjM3MSA0LjM3MSw0LjM3MSAyLjM1NywwIDQuMzcxLC0yLjAxNCA0LjM3MSwtNC4zNzEgeiBNIDM3Mi42ODcsMjUyLjk4NCBjIDAsMC42NjggMC4zMzQsMS4wMDIgMS4wMDIsMS4wMDIgaCAxOC44MjkgYyAwLjMzNSwwIDEuMDAzLC0wLjMzNCAxLjAwMywtMS4wMDIgMCwtMC42NzggLTAuNjY4LC0xLjAxMiAtMS4wMDMsLTEuMDEyIGggLTE4LjgyOSBjIC0wLjY2OCwwLjAwMSAtMS4wMDIsMC4zMzUgLTEuMDAyLDEuMDEyIHogbSA0OC40MTQsMS4zMzYgdiAxMTMuMzEgYyAwLDQuNzE0IC00LjAzNyw4Ljc1MSAtOC43NDEsOC43NTEgaCAtNTguNTAyIGMgLTQuNzE1LDAgLTguNzQyLC00LjAzNyAtOC43NDIsLTguNzUxIFYgMjU0LjMyIGMgMCwtNC43MDUgNC4wMjcsLTguNzMyIDguNzQyLC04LjczMiBoIDU4LjUwMiBjIDQuNzAzLDAgOC43NDEsNC4wMjcgOC43NDEsOC43MzIgeiIgaWQ9InBhdGgxNiIgc3R5bGU9ImNsaXAtcnVsZTpldmVub2RkO2ZpbGw6IzI1MzY0NTtmaWxsLXJ1bGU6ZXZlbm9kZCIvPjxyZWN0IGhlaWdodD0iMTAyLjg4OCIgaWQ9InJlY3QxOCIgc3R5bGU9ImNsaXAtcnVsZTpldmVub2RkO2ZpbGw6I2ZmZmZmZjtmaWxsLXJ1bGU6ZXZlbm9kZCIgd2lkdGg9IjY1LjIzODk5OCIgeD0iMzUwLjQ3OSIgeT0iMjU4LjM1Njk5Ii8+PHBhdGggZD0ibSAzODMuMTA4LDM2Mi45MzUgYyAtMi4zNTcsMCAtNC4zNzEsMi4wMTQgLTQuMzcxLDQuNjk1IDAsMi4zNTcgMi4wMTQsNC4zNzEgNC4zNzEsNC4zNzEgMi4zNTcsMCA0LjM3MSwtMi4wMTQgNC4zNzEsLTQuMzcxIDAsLTIuNjgyIC0yLjAxMywtNC42OTUgLTQuMzcxLC00LjY5NSB6IiBpZD0icGF0aDIwIiBzdHlsZT0iY2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDojZmZmZmZmO2ZpbGwtcnVsZTpldmVub2RkIi8+PHBhdGggZD0ibSAzNzMuNjg4LDI1My45ODYgaCAxOC44MjkgYyAwLjMzNSwwIDEuMDAzLC0wLjMzNCAxLjAwMywtMS4wMDIgMCwtMC42NzggLTAuNjY4LC0xLjAxMiAtMS4wMDMsLTEuMDEyIGggLTE4LjgyOSBjIC0wLjY2OCwwIC0xLjAwMiwwLjMzNCAtMS4wMDIsMS4wMTIgMC4wMDEsMC42NjggMC4zMzUsMS4wMDIgMS4wMDIsMS4wMDIgeiIgaWQ9InBhdGgyMiIgc3R5bGU9ImNsaXAtcnVsZTpldmVub2RkO2ZpbGw6I2ZmZmZmZjtmaWxsLXJ1bGU6ZXZlbm9kZCIvPjxwYXRoIGQ9Im0gMTgxLjAxOSwyNTkuMzY5IGggLTgzLjczIHYgMTAwLjUzIGggODMuNzI5IHYgLTEwMC41MyB6IG0gLTYyLjIwNSwtNi4zODUgYyAwLDAuNjY4IDAuMzM5LDEuMDAyIDEuMDA3LDEuMDAyIGggMzguNjcgYyAwLjY3OCwwIDEuMzQxLC0wLjMzNCAxLjM0MSwtMS4wMDIgMCwtMC42NzggLTAuNjYzLC0xLjAxMiAtMS4zNDEsLTEuMDEyIGggLTM4LjY3IGMgLTAuNjY4LDAuMDAxIC0xLjAwNywwLjMzNSAtMS4wMDcsMS4wMTIgeiBtIDY4LjU4OSwxLjMzNiB2IDExMy4zMSBjIDAsNC43MTQgLTQuMDIzLDguNzUxIC05LjA3MSw4Ljc1MSBIIDk5Ljk3NiBjIC00LjcsMCAtOC43MzcsLTQuMDM3IC04LjczNywtOC43NTEgViAyNTQuMzIgYyAwLC00LjcwNSA0LjAzNywtOC43MzIgOC43MzcsLTguNzMyIGggNzguMzU2IGMgNS4wNDgsMCA5LjA3MSw0LjAyNyA5LjA3MSw4LjczMiB6IiBpZD0icGF0aDI0IiBzdHlsZT0iY2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDojMjUzNjQ1O2ZpbGwtcnVsZTpldmVub2RkIi8+PHBhdGggZD0ibSAxMzkuMzI4LDM2Mi45MzUgYyAtMi42OTYsMCAtNC4zNzEsMi4wMTQgLTQuMzcxLDQuNjk1IDAsMi4zNTcgMS42NzUsNC4zNzEgNC4zNzEsNC4zNzEgMi4zNTMsMCA0LjM2NiwtMi4wMTQgNC4zNjYsLTQuMzcxIDAsLTIuNjgyIC0yLjAxMywtNC42OTUgLTQuMzY2LC00LjY5NSB6IiBpZD0icGF0aDI2IiBzdHlsZT0iY2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDojZmZmZmZmO2ZpbGwtcnVsZTpldmVub2RkIi8+PHBhdGggZD0ibSAxMTkuODIxLDI1My45ODYgaCAzOC42NyBjIDAuNjc4LDAgMS4zNDEsLTAuMzM0IDEuMzQxLC0xLjAwMiAwLC0wLjY3OCAtMC42NjMsLTEuMDEyIC0xLjM0MSwtMS4wMTIgaCAtMzguNjcgYyAtMC42NjgsMCAtMS4wMDcsMC4zMzQgLTEuMDA3LDEuMDEyIDAsMC42NjggMC4zMzksMS4wMDIgMS4wMDcsMS4wMDIgeiIgaWQ9InBhdGgyOCIgc3R5bGU9ImNsaXAtcnVsZTpldmVub2RkO2ZpbGw6I2ZmZmZmZjtmaWxsLXJ1bGU6ZXZlbm9kZCIvPjxyZWN0IGhlaWdodD0iMTAwLjUzIiBpZD0icmVjdDMwIiBzdHlsZT0iY2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDojZmZmZmZmO2ZpbGwtcnVsZTpldmVub2RkIiB3aWR0aD0iODMuNzI4OTk2IiB4PSI5Ny4yODkwMDEiIHk9IjI1OS4zNjg5OSIvPjwvZz48L2c+PGcgaWQ9IkxheWVyXzEiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMi4zMDEsLTIyLjMxKSIvPjwvc3ZnPg=='/>".html_safe
+    SCRIPT = "<script>if (window != window.parent) { document.getElementById('lazy_mobile_tester_button').remove(); } </script>".html_safe
+
+    def lazy_mobile_tester_button
+      button = button_to(IMG, url_for(params.permit!), method: :get, params: { _lazy: 1 }, style: LazyMobileTester.style, id: 'lazy_mobile_tester_button')
+      button + SCRIPT
+    end
+  end
+end

data/lib/lazy_mobile_tester/middleware.rb

@@ -0,0 +1,33 @@
+module LazyMobileTester
+  class Middleware
+    def initialize(app)
+      @app = app
+    end
+
+    def call(env)
+      dup.call!(env)
+    end
+
+    def call!(env)
+      if (env["REQUEST_URI"].include?("/_lazy") || env["REQUEST_URI"].include?("?_lazy")) && env['HTTP_ACCEPT'].to_s.starts_with?("text/html")
+        @url = env["REQUEST_PATH"].to_s.gsub(/\/\?_lazy=?1?/, "").presence || "/"
+        @uri = env["REQUEST_URI"].to_s.gsub(/\/\?_lazy=?1?/, "").presence || "/"
+        @uri = @uri.gsub(/_lazy/, "")
+        @uri = "/#{@uri}" unless @uri.starts_with?("/")
+
+        env["REQUEST_PATH"] = @url
+        env["REQUEST_URI"]  = @uri
+
+        [200, [], [ERB.new(template).result(binding)]]
+      else
+        @status, @headers, @response = @app.call(env)
+        [@status, @headers, @response]
+      end
+    end
+
+    def template
+      File.read("#{File.expand_path(File.dirname(__FILE__))}/../../app/views/lazy_mobile_tester/_toolbar.html.erb")
+    end
+
+  end
+end

data/lib/lazy_mobile_tester/version.rb

@@ -0,0 +1,3 @@
+module LazyMobileTester
+  VERSION = "0.1.0"
+end

data/lib/lazy_mobile_tester.rb

@@ -0,0 +1,58 @@
+require "lazy_mobile_tester/version"
+require "lazy_mobile_tester/middleware"
+require "lazy_mobile_tester/helper"
+require "lazy_mobile_tester/engine"
+
+module LazyMobileTester
+  mattr_accessor :enabled
+  @@enabled = true
+
+  mattr_accessor :resolutions
+  @@resolutions = {
+    "XS" => {
+      w: "320px",
+      h: "640px",
+      rotate: true,
+    },
+    "SM" => {
+      w: "576px",
+      h: "844px",
+      rotate: true,
+    },
+    "MD" => {
+      w: "834px",
+      h: "1112px",
+      rotate: true,
+    },
+    "LG" => {
+      w: "1280px",
+      h: "calc(100vh - var(--toolbar-height) - 10px)",
+      rotate: false,
+    },
+    "XL" => {
+      w: "1400px",
+      h: "calc(100vh - var(--toolbar-height) - 10px)",
+      rotate: false,
+    },
+    "100%" => {
+      w: "100%",
+      h: "calc(100vh - var(--toolbar-height) - 10px)",
+      rotate: false,
+    }
+  }
+
+  mattr_accessor :style
+  @@style = %s(
+    position: absolute;
+    left: 0;
+    top: 0;
+    z-index: 99999;
+    padding: 2px;
+    font-size: 8px;
+    background: #6f7dba;
+    color: white;
+    border: 0 none;
+    border-bottom-right-radius: 6px;
+  )
+
+end

data/lib/tasks/toggle_device_toolbar_tasks.rake

@@ -0,0 +1,4 @@
+# desc "Explaining what the task does"
+# task :lazy_mobile_tester do
+#   # Task goes here
+# end

metadata

@@ -0,0 +1,70 @@
+--- !ruby/object:Gem::Specification
+name: lazy_mobile_tester
+version: !ruby/object:Gem::Version
+  version: 0.1.0
+platform: ruby
+authors:
+- Igor Kasyanchuk
+autorequire:
+bindir: bin
+cert_chain: []
+date: 2022-03-17 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: rails
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+description: Lazy Mobile Tester from the page
+email:
+- igorkasyanchuk@gmail.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- MIT-LICENSE
+- README.md
+- Rakefile
+- app/assets/config/toggle_device_toolbar_manifest.js
+- app/views/lazy_mobile_tester/_toolbar.html.erb
+- config/routes.rb
+- lib/lazy_mobile_tester.rb
+- lib/lazy_mobile_tester/engine.rb
+- lib/lazy_mobile_tester/helper.rb
+- lib/lazy_mobile_tester/middleware.rb
+- lib/lazy_mobile_tester/version.rb
+- lib/tasks/toggle_device_toolbar_tasks.rake
+homepage: https://github.com/igorkasyanchuk/lazy_mobile_tester
+licenses:
+- MIT
+metadata:
+  homepage_uri: https://github.com/igorkasyanchuk/lazy_mobile_tester
+post_install_message:
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubygems_version: 3.2.3
+signing_key:
+specification_version: 4
+summary: Lazy Mobile Tester from the page
+test_files: []