Funciones de JustZix

Defines un patrón de URL, escribes código CSS y/o JS — la extensión lo inyecta automáticamente cada vez que se carga la página. Cada regla tiene su propio editor con resaltado de sintaxis (CodeMirror).

• CSS inyectado mediante una etiqueta <style> en el head del documento — especificidad completa disponible.
• JS ejecutado en el MAIN world de la página mediante chrome.scripting.executeScript — evita la CSP en el 99 % de los casos, tiene acceso a window.
• Activa / desactiva reglas individuales con un clic en la barra de herramientas flotante.
• El editor tiene tema oscuro/claro, números de línea, búsqueda y una barra de redimensionamiento arrastrable.

Saber más →

Estructura de cuatro niveles que escala desde «una corrección CSS rápida» hasta «100 reglas en 12 proyectos de cliente». Los interruptores se propagan en cascada por la jerarquía.

• Carpeta — nivel superior, tiene su propio patrón de URL y una etiqueta de 3 letras para el botón flotante.
• Grupo — suborganización dentro de una carpeta. Cada carpeta tiene al menos un grupo («Predeterminado» por defecto).
• Regla — la unidad CSS/JS propiamente dicha. Pertenece a un grupo. Tiene patrones de URL opcionales para acotar más.
• Acción — botón clicable en el panel de acciones que ejecuta JS personalizado bajo demanda.

Carpeta "cliente-acme"
├── Grupo "styles"
│   ├── Regla "ocultar anuncios"
│   └── Regla "modo oscuro"
└── Grupo "acciones"
    └── Regla "barra QA"
        ├── Acción "FILL"
        ├── Acción "CLR"
        └── Acción "COPY"

Saber más →

Coincide por URL exacta, sitio completo, todos los subdominios, o cualquier cosa que coincida con una subcadena. Los patrones pueden acumularse en los niveles carpeta + grupo + regla para un control preciso.

• https://example.com/admin — solo URL exacta
• https://example.com/* — todas las páginas del sitio
• https://*.example.com/* — todos los subdominios
• *://localhost:*/* — cualquier app local, cualquier puerto, cualquier protocolo
• *staging* — cualquier URL que contenga «staging»

Saber más →

Un pequeño botón redondo aparece en cada página donde coincide una de tus carpetas. Un clic activa/desactiva todas las carpetas coincidentes. El color muestra el estado actual de un vistazo.

• Inject Green (o el color de tu carpeta) — todas las carpetas coincidentes habilitadas.
• Syntax Orange — algunas habilitadas, algunas deshabilitadas (estado mixto).
• Muted Gray — todas deshabilitadas.
• Halt Red — extensión desactivada globalmente.
• El clic derecho abre un panel con todas las carpetas/grupos/reglas coincidentes para conmutar individualmente.
• Arrastra para reposicionar. Posición memorizada por ventana.

Saber más →

Una segunda barra flotante con controles interactivos. Cada acción es uno de seis tipos — desde un botón simple hasta un deslizador o un interruptor de tres estados. Cada una tiene una etiqueta, un color y un atajo de teclado opcional; la barra recuerda su posición, y un clic derecho la oculta durante el resto de la sesión.

• BUTTON — un botón fire-and-forget: un clic ejecuta código JS.
• SELECT — una lista desplegable; opciones estáticas o generadas por JS, elegir una dispara la acción.
• INPUT — un campo de texto en la barra, estilo command-bar — escribe un valor y confirma.
• SLIDER — un deslizador que controla una variable CSS en vivo (p. ej. brillo, zoom).
• TEXTAREA — un bloc de notas multilínea, contenido recordado por dominio.
• TOGGLE3 — un control segmentado de tres estados (p. ej. dev / staging / prod).

Saber más →

Dentro del JS de cualquier regla o del código de cualquier botón de acción tienes acceso a dos globales. window.JZ controla los botones de acción — llámalos programáticamente, encadena flujos de trabajo, intégralos con mutation observers. window.JUSTZIX es un logger que escribe directamente en la ventana Output Console — sin DevTools.

• JZ.click('LBL') — haz clic programáticamente en el botón de acción etiquetado «LBL».
• JZ.action('LBL') — obtén el elemento DOM del botón (dale estilo, comprueba sus atributos).
• JZ.actions() — array de todos los botones de acción visibles.
• JZ.labels() — array de las etiquetas originales (mayúsculas/minúsculas preservadas).
• La búsqueda no distingue mayúsculas. JZ.click('btn') = JZ.click('BTN').
• JUSTZIX.log() / .warn() / .error() / .info() / .debug() — escribe una entrada en la Output Console (alias: __JUSTZIX__, JZ.log, etc.).

// Acción «AUTO» — encadena otras tres acciones
JZ.click('LOAD');
setTimeout(() => JZ.click('PROC'), 500);
setTimeout(() => JZ.click('SAVE'), 1500);

Saber más →

Una clave de sincronización de 25 caracteres vincula tu cuenta. Todas las reglas, ajustes y cambios se propagan casi en tiempo real mediante Last-Write-Wins por entidad con marcas de tiempo de Lamport.

• Clave generada localmente — el backend nunca ve la forma legible (solo el hash SHA-256).
• Conflicto resuelto por entidad — nunca una sobrescritura en bloque de «todos tus ajustes».
• Los tombstones propagan correctamente las eliminaciones.
• UI de resolución de conflictos al iniciar sesión: usar el servidor / enviar el local / fusionar LWW.
• Pestaña Estado: historial de sincronización, vista de la biblioteca en la nube y resincronización completa con la cuenta.
• Limpieza de cuentas inactivas tras 12 meses (con correo de aviso 30 días antes).
• Recuperación por correo — una clave perdida emite una nueva.

Saber más →

Dos maneras de mover datos: enlaces públicos temporales para compartir con otros (JZS-XXXX-XXXX-XXXX-XXXX, TTL 1–48 h) y copias de seguridad automáticas por hora/diarias/semanales para ti mismo.

• TTL del enlace: 1h / 6h / 12h / 24h (predeterminado) / 48h. El token caduca automáticamente.
• El destinatario ve una vista previa antes de importar — con un banner de aviso JS si el paquete contiene JavaScript.
• Cinco formatos de exportación: justzix-full, partial, folder, group, rule.
• Copias de seguridad: 24 por hora + 30 diarias + 8 semanales, limpieza automática de las más antiguas.
• Panel «Mis enlaces» con contador de descargas y botón de revocación.

Saber más →

Cinco tipos de ventanas de desarrollo que se renderizan directamente en la página — sin DevTools. Las arrastras, las acoplas borde con borde y las unes en un mini-panel. Cada ventana puede ser persistente (ligada a una regla) o temporal (TEMP, invocada con un atajo).

• CSS pane — un editor CSS en vivo, los cambios aparecen al instante, contenido conservado por pestaña.
• JS pane — un editor JS ejecutado bajo demanda con un botón Run (Ctrl+Enter).
• JS Console — un REPL en la página: escribe, Enter, resultado; historial de comandos con las flechas.
• Output Console — un visor de registros de la página con 6 pestañas contadas: All, JZconsole, console.*, Network, errores y pushes a dataLayer. La pestaña Network tiene filtros por dominio, tamaño y tiempo.
• AI Helper — un asistente de IA integrado (OpenAI / Anthropic / Gemini): inspecciona la página, prueba el código en ventanas TEMP y, tras tu aprobación, crea reglas.
• Búsqueda en los editores — una barra sobre cada editor CSS/JS: contador de coincidencias, resaltado, atajos Ctrl+Alt+←/→.
• TEMP panes — las mismas ventanas bajo Ctrl+Alt+G/H/J/K, efímeras, desaparecen al recargar.
• Drag & snap & connect — arrastra las ventanas, acóplalas por los bordes, únelas en grupos.
• Personalización por ventana — color, fuente y tamaño desde el menú del clic derecho.

Ctrl+Alt+G  →  TEMP CSS pane
Ctrl+Alt+H  →  TEMP JS pane
Ctrl+Alt+J  →  TEMP JS Console
Ctrl+Alt+K  →  TEMP Output Console
Ctrl+Alt+\  →  AI Helper

Saber más →