lato 0.1.43 → 0.1.45

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: a34ec33506d24a255aa70857414131f233bcc5c812f3b38f139cd4e02cffc9f6
-  data.tar.gz: f88a6b9db1e9956281ead6dfe9858d62eb421158d45484184df1fbe822fbdd53
+  metadata.gz: ba6b933633ecf25125ed9a54bd4378ccd2675dc4e5faba0a7bb24e92288a1dc9
+  data.tar.gz: '069cf1f1a248778481e77149c3681624b7fd17402629a116515c952bb62bb1da'
 SHA512:
-  metadata.gz: 9ca0377c4ec076da3438e2021ecdc089671ce9f5275e5531dbf9f772c077f6630728806f3f3d889708c2335cead5951e0c3b5bbe289e4cb58a2d7a38bed739c5
-  data.tar.gz: dde9d1be128466a57cfdceac660b5b6ab7cb2dd2b78465e29e7e42339bb7f7d13f6c7e2e7bb6b05cbcb970cb2884aed8913a08181619d0f3c8c1f21e70a0040c
+  metadata.gz: b5b1dd959434a3ccc753b482596fc37d9e6578f1f309b25fc7d490db56ab04931dda5061f48aceec0255720b7268ff7cd8778b9aef4c39761103b904b8f69737
+  data.tar.gz: c94d87c207c778834654f5481948b31a681be7c3e74952327f8246cd33f16c4f62f14b4141e5a10c4a74e30eddbabbe0a90077eafc4c173e682d94a9f8024e1b

data/app/assets/javascripts/lato/application.js

@@ -5,19 +5,49 @@ import "bootstrap"
 // Import controllers (stimulus rails)
 import "controllers"
 
-// Close sidebar before page change with turbo
-document.addEventListener("turbo:before-visit", (e) => {
-  document.body.classList.remove('aside-open')
+/**
+ * Manage page transitions
+ */
+
+const PAGE_TRANSITION_TIME = 150
+
+document.addEventListener('DOMContentLoaded', () => {
+  console.log('DOMContentLoaded')
+
+  // add is-loaded class
+  document.body.classList.add('is-loaded')
 })
 
-// Close all boostrap modals before page change with turbo
-// NOTE: This is not a good solution, but it seems to work
-document.addEventListener("turbo:before-visit", (e) => {
-  document.querySelectorAll('.modal.show').forEach((modal) => {
-    modal.classList.remove('show')
-  })
+document.addEventListener('turbo:load', () => {
+  console.log('turbo:load')
+
+  setTimeout(() => {
+    // add is-loaded class
+    document.body.classList.add('is-loaded')
+  }, PAGE_TRANSITION_TIME)
+})
 
-  document.querySelectorAll('.modal-backdrop').forEach((backdrop) => {
-    backdrop.remove()
+document.addEventListener('turbo:before-render', (e) => {
+  console.log('turbo:before-render')
+
+  e.preventDefault()
+
+  // remove is-loaded class
+  document.body.classList.remove('is-loaded')
+
+  // hide modals and make body scrollable
+  document.querySelectorAll('.modal.show').forEach((el) => {
+    el.classList.remove('show')
+    el.style.display = 'none'
   })
-})
+  document.querySelectorAll('.modal-backdrop').forEach((el) => {
+    el.remove()
+  })
+  document.body.classList.remove('modal-open')
+  document.body.style.paddingRight = ''
+  document.body.style.overflow = ''
+
+  setTimeout(() => {
+    e.detail.resume()
+  }, PAGE_TRANSITION_TIME)
+})

data/app/assets/javascripts/lato/controllers/lato_action_controller.js

@@ -84,10 +84,7 @@ export default class extends Controller {
       this.modalBodyTargets[index].innerHTML = `
       <turbo-frame id="${options.turboFrame}">
       <div class="placeholder-glow">
-        <span class="placeholder placeholder-lg col-12"></span>
-        <span class="placeholder placeholder-lg col-12"></span>
-        <span class="placeholder placeholder-lg col-12"></span>
-        <span class="placeholder placeholder-lg col-12"></span>
+        ${Array(options.actionRows).fill().map(() => `<span class="placeholder placeholder-lg col-12"></span>`).join('')}
       </div>
       </turbo-frame>
       `
@@ -115,6 +112,8 @@ export default class extends Controller {
     options.turboFrame = element.getAttribute('data-turbo-frame')
     options.actionTitle = element.getAttribute('data-action-title')
     options.actionSize = element.getAttribute('data-action-size')
+    options.actionRows = element.getAttribute('data-action-rows')
+    options.actionRows = options.actionRows ? parseInt(options.actionRows) : 4
     return options
   }
 

data/app/assets/stylesheets/lato/application.scss

@@ -24,8 +24,18 @@
 
 /** Custom style */
 
+body {
+  &.is-loaded {
+    main {
+      opacity: 1;
+    }
+  }
+}
+
 main {
   width: 100%;
+  opacity: 0;
+  transition: opacity 0.15s ease-in-out;
 }
 
 main, aside {

data/lib/lato/version.rb

@@ -1,3 +1,3 @@
 module Lato
-  VERSION = "0.1.43"
+  VERSION = "0.1.45"
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: lato
 version: !ruby/object:Gem::Version
-  version: 0.1.43
+  version: 0.1.45
 platform: ruby
 authors:
 - Gregorio Galante
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2023-03-10 00:00:00.000000000 Z
+date: 2023-03-21 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails