[skip ci] Recompilar JS

.woodpecker.yml

@@ -1,27 +1,25 @@
 pipeline:
   build:
-    image: registry.nulo.in/sutty/haini.sh:root
+    image: registry.nulo.in/sutty/haini.sh:latest
     commands:
-      - rm -f assets/js/*
+      - rm assets/js/*
       - make yarn hainish="sh -c"
       - make webpack hainish="sh -c"
-
+  commit:
+    image: registry.nulo.in/sutty/haini.sh:latest
+    commands:
       - mkdir ~/.ssh/
       - eval $(ssh-agent -s)
       - echo "$${GIT_BASE64_SSH_KEY}" | base64 -d | ssh-add -
+      - echo [nulo.in]:420 ssh-rsa AAAAB3NzaC1yc2EAAAADAQABAAACAQCPfptutxU1zs6ATFn/kkqLrsXzsJRMNxrPd9hfsccE2TAPnbLtcqFydioyx5ww+dacFFQ8xb481yYuFMof24XwsNQG0tGmrGNm321ewt4fHihfu8cvzE0WPcfgGGg8YETLvkkFNVC9p3JOeC1+X9YU/QHaSv7NQ9AmEYxYUD/qeZRAsm9NtbmwDxLUQixD6AMMLVKiUGFRIbdrDkCrQgqCb+0d06vG1DyPzhOhD+MyRwKAqizBE0KmqOYaNmCBkHqopphny0wMpqpWVO2OQCNeTCWmqzVvDvxOFS5ToMbueModINZuV9jGmsXz9FO3F0TinejxPBENgBJ1MPTEgoV4M8XqCfqw0yLvpB676fjHvxqdTfZqICcv26GBYbVY0DcGXR2dM2Un4uNfx30Ml22DDlpCBPkEILvZc9zMO3nm0XK8/yJCF17oitZu0a+j32MjOovvtvdVuwxe0KdoUaFa833a+hO/UKMycwCk8HARoIO6YPakcsqy7a+FTOVgWNY6cRMjJ8trUR1Fwi1kYo1o+VkRnU/l62xPr+BTleueZQnlXh1OGYpMwiwbcPYoqxr2CQp3rohmcypgWkMJESIrPnKPDJaQuCYruqOVmU5nJW5FJ3HIUgf1TiRyp+LXbSdXvKt3mnpV4aQkG9GSKzNl19Dx3AYQyUPImfekFLrpfw== > ~/.ssh/known_hosts
+      - echo [nulo.in]:420 ecdsa-sha2-nistp256 AAAAE2VjZHNhLXNoYTItbmlzdHAyNTYAAAAIbmlzdHAyNTYAAABBBGPkgRVWYcVcgjI0xAjDgZQsYuXU9edcya8zna01ibyUMlfKHIMD9yOoq0R+fQPTCqwiol/2tKMPJ2hlKshc+H8= >> ~/.ssh/known_hosts
       - echo [nulo.in]:420 ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIHgHIbf5/jkeyLMndnWlEO12DPj41YPqkmz+aIreVOsP >> ~/.ssh/known_hosts
-
+      - git checkout ${DRONE_BRANCH} # Tenemos que hacer esto porque Woodpecker solo `git reset` ea el commit que quiere.
       - git config user.name Woodpecker
       - git config user.email ci@nulo.in
+      - git add assets/js/* _data/assets.json
+      - git commit -m "[skip ci] Recompilar JS"
       - git remote add nulo ssh://_gitea@nulo.in:420/Sutty/sutty-base-jekyll-theme.git
-      - git diff-index --quiet HEAD --ignore-submodules || ( git add assets/js/pack* && git commit assets/js/ _data/assets.json -m "[skip ci] Recompilar JS" && git push -u nulo HEAD:${DRONE_BRANCH} )
+      - git push -u nulo ${DRONE_BRANCH}
     secrets:
       - git_base64_ssh_key
-    when:
-      path:
-        include:
-          - _packs/*
-          - package.json
-          - yarn.lock
-          - webpack.*.js
-          - .woodpecker.yml

_data/assets.json

@@ -1,4 +1,4 @@
 {
-  "assets/js/pack.js": "assets/js/pack.83a8cdd48652c0acbf04.js",
-  "assets/js/pack.js.map": "assets/js/pack.83a8cdd48652c0acbf04.js.map"
+  "assets/js/pack.js": "assets/js/pack.d2c9fc926fed547c03f8.js",
+  "assets/js/pack.js.map": "assets/js/pack.d2c9fc926fed547c03f8.js.map"
 }

_includes/share_box.html

@@ -1,17 +1,4 @@
-{%- assign title = include.title | escape -%}
-{%- assign text = include.description | strip_html | escape -%}
-{%- assign url = site.url | append: include.url | escape -%}
-
-<input
-  data-controller="share"
-  data-action="share#share"
-  data-share-title-value="{{ title }}"
-  data-share-text-value="{{ text }}"
-  data-share-url-value="{{ url }}"
-  type="checkbox"
-  id="share"
-  class="toggler"
-  autocomplete="off" />
+<input type="checkbox" id="share" class="toggler" autocomplete="off" />
 
 <label class="share btn border btn-block" for="share">
   {{ site.i18n.share.text }}

_packs/controllers/search_controller.js

@@ -16,7 +16,7 @@ export default class extends Controller {
   }
 
   connect () {
-    const q = new URLSearchParams(window.location.search).get('q')?.trim()
+    const q = new URLSearchParams(window.location.search).get('q').trim()
 
     if (q) {
       this.qTarget.value = q

_packs/controllers/share_controller.js

@@ -1,27 +0,0 @@
-import { Controller } from 'stimulus'
-
-export default class extends Controller {
-  static values = {
-    title: String,
-    text: String,
-    url: String
-  }
-
-  async share (event = undefined) {
-    event?.preventDefault()
-    event?.stopPropagation()
-
-    const title = this.titleValue
-    const text = this.textValue
-    const url = this.urlValue
-    const data = { title, text, url }
-
-    if ('share' in navigator) {
-      if (navigator.canShare(data)) {
-        navigator.share(data)
-      } else {
-        console.error('No se puede compartir', data)
-      }
-    }
-  }
-}

_packs/entry.js

@@ -1,34 +1,16 @@
-import BotDetector from 'device-detector-js/dist/parsers/bot'
 import { Notifier } from '@airbrake/browser'
 
-window.bot_detector = new BotDetector
-const bot = window.bot_detector.parse(navigator.userAgent)
-
-if (!bot) {
-  window.airbrake = new Notifier({
-    projectId: window.env.AIRBRAKE_PROJECT_ID,
-    projectKey: window.env.AIRBRAKE_PROJECT_KEY,
-    host: 'https://panel.sutty.nl'
-  })
-
-  console.originalError = console.error
-  console.error = (...e) => {
-    window.airbrake.notify(e.join(' '))
-    return console.originalError(...e)
-  }
-}
+window.airbrake = new Notifier({
+  projectId: window.env.AIRBRAKE_PROJECT_ID,
+  projectKey: window.env.AIRBRAKE_PROJECT_KEY,
+  host: 'https://panel.sutty.nl'
+})
 
 import 'core-js/stable'
 import 'regenerator-runtime/runtime'
 
-// Turbo acelera la navegación al no tener que recargar todo el JS y CSS
-// de la página, con lo que se siente más rápida y "nativa".
-//
-// Cambiamos de turbolinks a turbo porque turbo soporta la función
-// fetch(), que luego es interceptada por el SW para obtener las
-// direcciones localmente.
-import * as Turbo from "@hotwired/turbo"
-Turbo.start()
+const Turbolinks = require("turbolinks")
+Turbolinks.start()
 
 import { Application } from 'stimulus'
 import { definitionsFromContext } from "stimulus/webpack-helpers"
@@ -37,17 +19,33 @@ const application = Application.start()
 const context = require.context("./controllers", true, /\.js$/)
 application.load(definitionsFromContext(context))
 
+// Prevenir que Turbolinks interfiera con la navegación por anchors
+// https://github.com/turbolinks/turbolinks/issues/75#issuecomment-445325162
+document.addEventListener('turbolinks:click', event => {
+  const anchorElement = event.target
+  const isSamePageAnchor = (
+    anchorElement.hash &&
+    anchorElement.origin === window.location.origin &&
+    anchorElement.pathname === window.location.pathname
+  )
+
+  if (!isSamePageAnchor) return
+
+  Turbolinks.controller.pushHistoryWithLocationAndRestorationIdentifier(event.data.url, Turbolinks.uuid())
+
+  event.preventDefault()
+})
+
 try {
   window.axe = require('axe-core/axe')
 } catch(e) {}
 
 if (window.axe) window.axe.configure({ locale: require('axe-core/locales/es.json') })
 
-document.addEventListener('turbo:load', event => {
-  document.querySelectorAll("a[href^='http://'],a[href^='https://'],a[href^='//']").forEach(a => {
-    a.rel = "noopener"
-    a.target = "_blank"
-  })
+// Prevenir que Turbolinks interfiera la navegación a un anchor al
+// recargar la página
+document.addEventListener('turbolinks:load', event => {
+  window.location.hash = window.location.hash
 
   if (!window.axe) return
 

assets/css/styles.scss

@@ -118,6 +118,9 @@ $label-margin-bottom: 0;
 @import "editor";
 @import "menu";
 
+/// La barra de progreso de Turbolinks tiene el color primario
+/// de la paleta, definido por Bootstrap o por nosotres.
+.turbolinks-progress-bar { background-color: $primary; }
 /// La barra de progreso de Turbo tiene el color primario
 /// de la paleta, definido por Bootstrap o por nosotres.
 .turbo-progress-bar { background-color: $primary; }

assets/js/script.js

@@ -0,0 +1,44 @@
+---
+---
+
+const loadEvent = () => {
+  try {
+    if (Turbolinks) return 'turbolinks:load'
+  } catch {
+    return 'DOMContentLoaded'
+  }
+}
+
+document.addEventListener(loadEvent(), () => {
+  document.querySelectorAll('.share').forEach(share => {
+    share.addEventListener('click', event => {
+      if (!Navigator.share) return;
+
+      event.preventDefault();
+      event.stopPropagation();
+
+      const title = document.querySelector('title').text;
+
+      try {
+        const text = document.querySelector('meta[property="og:description"]').content;
+      } catch {
+        const text = '';
+      }
+
+      try {
+        const url = document.querySelector('link[rel=canonical]').href;
+      } catch {
+        const url = document.location.href;
+      }
+
+      const data = { title: title, text: text, url: url };
+
+      if (Navigator.canShare(data)) Navigator.share(data).then();
+    });
+  });
+
+  document.querySelectorAll("a[href^='http://'],a[href^='https://'],a[href^='//']").forEach(a => {
+    a.rel = "noopener";
+    a.target = "_blank";
+  });
+});

package.json

@@ -12,11 +12,9 @@
     "@babel/core": "^7.10.4",
     "@babel/plugin-proposal-class-properties": "^7.10.4",
     "@babel/preset-env": "^7.10.4",
-    "@hotwired/turbo": "^7.0.0-rc.4",
     "axe-core": "^4.1.2",
     "babel-loader": "^8.1.0",
     "core-js": "^3.6.5",
-    "device-detector-js": "^2.2.10",
     "dotenv-webpack": "^6.0.0",
     "liquidjs": "^9.14.0",
     "regenerator-runtime": "^0.13.5",
@@ -24,6 +22,7 @@
     "sassdoc-theme-herman": "^4.0.2",
     "stimulus": "^1.1.1",
     "svgo": "^2.5.0",
+    "turbolinks": "^5.2.0",
     "webpack": "^4.43.0",
     "webpack-assets-manifest": "~4",
     "webpack-cli": "^3.3.12",

yarn.lock

@@ -880,11 +880,6 @@
     "@babel/helper-validator-identifier" "^7.14.0"
     to-fast-properties "^2.0.0"
 
-"@hotwired/turbo@^7.0.0-rc.4":
-  version "7.0.0-rc.4"
-  resolved "https://registry.yarnpkg.com/@hotwired/turbo/-/turbo-7.0.0-rc.4.tgz#d3ab9555544534f5ec649613553e72ff6c7d7122"
-  integrity sha512-4qx+6O6mUN+cSN+ZLGCOGc+2MxNrs7cFbmnWD6LIfiHAQyuNiIuB87Y5IAtOo8xj16fOBd2CdU1WRJya4Wkw0A==
-
 "@sindresorhus/is@^0.14.0":
   version "0.14.0"
   resolved "https://registry.yarnpkg.com/@sindresorhus/is/-/is-0.14.0.tgz#9fb3a3cf3132328151f353de4632e01e52102bea"
@@ -2519,11 +2514,6 @@ detect-node@^2.0.4:
   resolved "https://registry.yarnpkg.com/detect-node/-/detect-node-2.1.0.tgz#c9c70775a49c3d03bc2c06d9a73be550f978f8b1"
   integrity sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==
 
-device-detector-js@^2.2.10:
-  version "2.2.10"
-  resolved "https://registry.yarnpkg.com/device-detector-js/-/device-detector-js-2.2.10.tgz#a8fd47837ce89024d7647a4ddf18154d7a920538"
-  integrity sha512-zLcDSU10WIqbARXecaVJJxx0ZuGWq+MVhj9f9qehdBCFr9RMa5mQGTt2IZNIgKuCIind/j/DzRDViEdc2FfBGQ==
-
 diffie-hellman@^5.0.0:
   version "5.0.3"
   resolved "https://registry.yarnpkg.com/diffie-hellman/-/diffie-hellman-5.0.3.tgz#40e8ee98f55a2149607146921c63e1ae5f3d2875"
@@ -6388,6 +6378,11 @@ tty-browserify@0.0.0:
   resolved "https://registry.yarnpkg.com/tty-browserify/-/tty-browserify-0.0.0.tgz#a157ba402da24e9bf957f9aa69d524eed42901a6"
   integrity sha1-oVe6QC2iTpv5V/mqadUk7tQpAaY=
 
+turbolinks@^5.2.0:
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/turbolinks/-/turbolinks-5.2.0.tgz#e6877a55ea5c1cb3bb225f0a4ae303d6d32ff77c"
+  integrity sha512-pMiez3tyBo6uRHFNNZoYMmrES/IaGgMhQQM+VFF36keryjb5ms0XkVpmKHkfW/4Vy96qiGW3K9bz0tF5sK9bBw==
+
 type-fest@^0.8.1:
   version "0.8.1"
   resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.8.1.tgz#09e249ebde851d3b1e48d27c105444667f17b83d"