JSFiddle - React, Tailwind, and code Playground

by Katarn

JavaScript

(function () {
        var score = 0;
        var lastHiddenAt = 0;
        var lastBlurAt = 0;

        function emit(reason, data) {
          var payload = {
            reason: reason,
            score: score,
            data: data || {},
            ts: Date.now()
          };

          alert('[capture-signal]' + JSON.stringify(payload));

          // Producción:
          // navigator.sendBeacon('/capture-signal', JSON.stringify(payload));
        }

        window.addEventListener('keyup', function (e) {
          var isPrintScreen = e.key === 'PrintScreen';
          var isMacScreenshot =
            e.metaKey &&
            e.shiftKey &&
            (e.key === '3' || e.key === '4' || e.key === '5');

          if (isPrintScreen || isMacScreenshot) {
            score += 5;
            emit('keyboard_screenshot', { key: e.key });
          }
        });

        document.addEventListener('visibilitychange', function () {
          if (document.visibilityState === 'hidden') {
            lastHiddenAt = Date.now();
            emit('visibility_hidden');
            return;
          }

          if (document.visibilityState === 'visible' && lastHiddenAt) {
            var ms = Date.now() - lastHiddenAt;
            emit('visibility_visible', { durationMs: ms });

            if (ms > 0 && ms < 1000) {
              score += 2;
              emit('quick_visibility_switch', { durationMs: ms });
            }

            lastHiddenAt = 0;
          }
        });

        window.addEventListener('blur', function () {
          lastBlurAt = Date.now();
          emit('window_blur');
        });

        window.addEventListener('focus', function () {
          if (!lastBlurAt) return;
          var ms = Date.now() - lastBlurAt;
          emit('window_focus', { durationMs: ms });

          if (ms > 0 && ms < 1000) {
            score += 2;
            emit('quick_focus_switch', { durationMs: ms...