destroy-the-text 2.0.0 → 2.0.2

package/dist/DestroyTheText.d.ts

@@ -14,6 +14,8 @@ export declare class DestroyTheText {
     constructor(params: DestroyTheTextOptions);
     private buildLetters;
     private attachEventListener;
+    private shakeScreen;
+    private triggerFlash;
     private destrozar;
 }
 //# sourceMappingURL=DestroyTheText.d.ts.map

package/dist/DestroyTheText.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DestroyTheText.d.ts","sourceRoot":"","sources":["../src/DestroyTheText.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAQtD,qBAAa,cAAc;IACvB,OAAO,CAAC,SAAS,CAAM;IACvB,OAAO,CAAC,QAAQ,CAA2B;IAC3C,OAAO,CAAC,OAAO,CAAkB;IACjC,OAAO,CAAC,KAAK,CAAa;IAC1B,OAAO,CAAC,WAAW,CAA0C;IAC7D,OAAO,CAAC,SAAS,CAAkB;IACnC,OAAO,CAAC,IAAI,CAA4B;IACxC,OAAO,CAAC,IAAI,CAAqB;IACjC,OAAO,CAAC,eAAe,CAAc;IACrC,OAAO,CAAC,aAAa,CAAc;IACnC,OAAO,CAAC,KAAK,CAA4B;gBAE7B,MAAM,EAAE,qBAAqB;IAuCzC,OAAO,CAAC,YAAY;IAoCpB,OAAO,CAAC,mBAAmB;IA6B3B,OAAO,CAAC,SAAS;CAiEpB"}
+{"version":3,"file":"DestroyTheText.d.ts","sourceRoot":"","sources":["../src/DestroyTheText.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAStD,qBAAa,cAAc;IACvB,OAAO,CAAC,SAAS,CAAM;IACvB,OAAO,CAAC,QAAQ,CAA2B;IAC3C,OAAO,CAAC,OAAO,CAAkB;IACjC,OAAO,CAAC,KAAK,CAAa;IAC1B,OAAO,CAAC,WAAW,CAA0C;IAC7D,OAAO,CAAC,SAAS,CAAkB;IACnC,OAAO,CAAC,IAAI,CAA4B;IACxC,OAAO,CAAC,IAAI,CAAqB;IACjC,OAAO,CAAC,eAAe,CAAc;IACrC,OAAO,CAAC,aAAa,CAAc;IACnC,OAAO,CAAC,KAAK,CAA4B;gBAE7B,MAAM,EAAE,qBAAqB;IAuCzC,OAAO,CAAC,YAAY;IAoCpB,OAAO,CAAC,mBAAmB;IA6B3B,OAAO,CAAC,WAAW;IAcnB,OAAO,CAAC,YAAY;IAmBpB,OAAO,CAAC,SAAS;CAgFpB"}

package/dist/DestroyTheText.js

@@ -1,6 +1,7 @@
 import { Tool } from "./types";
 import { Pixel } from "./Pixel";
 import { Letra } from "./Letra";
+import { Spark } from "./Spark";
 import { DTTSounds } from "./DTTSounds";
 // @ts-ignore - jQuery require
 const $ = require("jquery");
@@ -20,7 +21,7 @@ export class DestroyTheText {
         }
         this.originalTagName = elem.tagName;
         this.originalClass = elem.className;
-        this.container = $(document.createElement("div"));
+        this.container = $(document.createElement(this.originalTagName.toLowerCase()));
         this.container.attr("id", params.textId);
         this.container.addClass(this.originalClass);
         this.arma = params.arma;
@@ -94,9 +95,39 @@ export class DestroyTheText {
                 break;
         }
     }
+    shakeScreen(intensity) {
+        const target = $("section[class*='hero']").first();
+        const elementToShake = target.length ? target : $("body");
+        const x = (Math.random() - 0.5) * intensity;
+        const y = (Math.random() - 0.5) * intensity;
+        elementToShake.css("transform", `translate(${x}px, ${y}px)`);
+        setTimeout(() => {
+            elementToShake.css("transform", "translate(0, 0)");
+        }, 50);
+    }
+    triggerFlash() {
+        const flash = $(document.createElement("div"));
+        flash.css({
+            position: "fixed",
+            top: 0,
+            left: 0,
+            width: "100vw",
+            height: "100vh",
+            backgroundColor: "white",
+            opacity: 0.05,
+            zIndex: 9999,
+            pointerEvents: "none",
+        });
+        $("body").append(flash);
+        setTimeout(() => {
+            flash.remove();
+        }, 50);
+    }
     destrozar(letter, e, arma) {
+        let isFirstShot = false;
         if (!this.started) {
             this.started = true;
+            isFirstShot = true;
             if (this.callback) {
                 this.callback();
             }
@@ -104,6 +135,12 @@ export class DestroyTheText {
         if (letter.hasClass("oculto")) {
             return;
         }
+        // Game Juice: Screen Shake
+        // Don't shake on first shot (avoids layout shift) and don't shake for Hand weapons
+        if (!isFirstShot && arma !== Tool.hand && arma !== Tool.specialHand) {
+            this.shakeScreen(arma === Tool.bigGun ? 5 : 10);
+            this.triggerFlash();
+        }
         $("#mouse").addClass("mouseOver");
         setTimeout(() => {
             $("#mouse").removeClass("mouseOver");
@@ -150,6 +187,10 @@ export class DestroyTheText {
             for (let j = 0; j < n; j++) {
                 new Pixel(e.pageX, e.pageY, letter.parent().css("color"));
             }
+            // Sparks
+            for (let k = 0; k < 5; k++) {
+                new Spark(e.pageX, e.pageY);
+            }
             DTTSounds.playGun();
         }
     }

package/dist/Letra.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Letra.d.ts","sourceRoot":"","sources":["../src/Letra.ts"],"names":[],"mappings":"AAAA,qBAAa,KAAK;IACd,OAAO,CAAC,CAAC,CAAS;IAClB,OAAO,CAAC,CAAC,CAAS;IAClB,OAAO,CAAC,SAAS,CAAM;IACvB,OAAO,CAAC,SAAS,CAA2B;IAC5C,OAAO,CAAC,YAAY,CAAa;gBAErB,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG;IAiChD,OAAO,CAAC,OAAO;IAQf,OAAO,CAAC,qBAAqB;CAGhC"}
+{"version":3,"file":"Letra.d.ts","sourceRoot":"","sources":["../src/Letra.ts"],"names":[],"mappings":"AAAA,qBAAa,KAAK;IACd,OAAO,CAAC,CAAC,CAAS;IAClB,OAAO,CAAC,CAAC,CAAS;IAClB,OAAO,CAAC,SAAS,CAAM;IACvB,OAAO,CAAC,SAAS,CAA2B;IAC5C,OAAO,CAAC,YAAY,CAAa;gBAErB,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG;IA0BhD,OAAO,CAAC,OAAO;IAQf,OAAO,CAAC,qBAAqB;CAGhC"}

package/dist/Letra.js

@@ -7,20 +7,15 @@ export class Letra {
         this.container.removeClass("oculto");
         this.container.addClass("absolute");
         this.x = x;
-        this.y = y;
+        this.y = y - 20;
         this.container.css("color", container.parent().css("color"));
-        this.container.css("left", this.x + "px");
-        this.container.css("top", this.y + "px");
-        let fontSize = container.css("font-size");
-        if (fontSize === undefined) {
-            fontSize = container.parent().css("font-size");
-        }
-        if (fontSize !== undefined) {
-            this.container.css("font-size", fontSize);
-            this.container.css("margin-top", "-" + fontSize);
-        }
+        this.container.css("font-size", container.parent().css("font-size"));
+        this.container.css("font-weight", container.parent().css("font-weight"));
+        this.container.css("font-family", container.parent().css("font-family"));
+        this.container.css("left", x + "px");
+        this.container.css("top", y + "px");
         $("body").append(this.container);
-        const interval = setInterval(() => this.gravity(), 1);
+        const interval = setInterval(() => this.gravity(), 10);
         setTimeout(() => {
             clearInterval(interval);
             this.container.remove();
@@ -30,7 +25,7 @@ export class Letra {
     gravity() {
         this.container.css("left", this.x + "px");
         this.container.css("top", this.y + "px");
-        this.gravitySpeed += 0.01;
+        this.gravitySpeed += 0.2;
         this.y += this.gravitySpeed;
         this.x += this.direction.x;
     }

package/dist/Pixel.d.ts

@@ -4,8 +4,12 @@ export declare class Pixel {
     private container;
     private direction;
     private gravitySpeed;
+    static activePixels: Pixel[];
+    static MAX_PIXELS: number;
+    private interval;
     constructor(x: number, y: number, color: string);
     private gravity;
     private getPositiveOrNegative;
+    destroy(): void;
 }
 //# sourceMappingURL=Pixel.d.ts.map

package/dist/Pixel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Pixel.d.ts","sourceRoot":"","sources":["../src/Pixel.ts"],"names":[],"mappings":"AAAA,qBAAa,KAAK;IACd,OAAO,CAAC,CAAC,CAAS;IAClB,OAAO,CAAC,CAAC,CAAS;IAClB,OAAO,CAAC,SAAS,CAAM;IACvB,OAAO,CAAC,SAAS,CAA2B;IAC5C,OAAO,CAAC,YAAY,CAAa;gBAErB,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM;IAuB/C,OAAO,CAAC,OAAO;IAQf,OAAO,CAAC,qBAAqB;CAGhC"}
+{"version":3,"file":"Pixel.d.ts","sourceRoot":"","sources":["../src/Pixel.ts"],"names":[],"mappings":"AAAA,qBAAa,KAAK;IACd,OAAO,CAAC,CAAC,CAAS;IAClB,OAAO,CAAC,CAAC,CAAS;IAClB,OAAO,CAAC,SAAS,CAAM;IACvB,OAAO,CAAC,SAAS,CAA2B;IAC5C,OAAO,CAAC,YAAY,CAAa;IACjC,MAAM,CAAC,YAAY,EAAE,KAAK,EAAE,CAAM;IAClC,MAAM,CAAC,UAAU,SAAO;IACxB,OAAO,CAAC,QAAQ,CAAM;gBAEV,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM;IAyB/C,OAAO,CAAC,OAAO;IAmBf,OAAO,CAAC,qBAAqB;IAItB,OAAO;CAIjB"}

package/dist/Pixel.js

@@ -12,21 +12,36 @@ export class Pixel {
         this.container.css("left", this.x + "px");
         this.container.css("top", this.y + "px");
         $("body").append(this.container);
-        const interval = setInterval(() => this.gravity(), 1);
-        setTimeout(() => {
-            clearInterval(interval);
-            this.container.remove();
-        }, 3000);
+        this.interval = setInterval(() => this.gravity(), 10);
         this.direction = { x: this.getPositiveOrNegative() * Math.random(), y: 0 };
+        Pixel.activePixels.push(this);
+        if (Pixel.activePixels.length > Pixel.MAX_PIXELS) {
+            const oldPixel = Pixel.activePixels.shift();
+            oldPixel?.destroy();
+        }
     }
     gravity() {
-        this.container.css("left", this.x + "px");
-        this.container.css("top", this.y + "px");
-        this.gravitySpeed += 0.01;
+        this.gravitySpeed += 0.2;
         this.y += this.gravitySpeed;
         this.x += this.direction.x;
+        // Floor collision
+        if (this.y >= window.innerHeight - 10) {
+            this.y = window.innerHeight - 10;
+            this.gravitySpeed = 0;
+            this.direction.x = 0;
+            clearInterval(this.interval);
+            this.container.css("opacity", "0.8");
+        }
+        this.container.css("left", this.x + "px");
+        this.container.css("top", this.y + "px");
     }
     getPositiveOrNegative() {
         return Math.floor(Math.random() * 2) === 0 ? -1 : 1;
     }
+    destroy() {
+        clearInterval(this.interval);
+        this.container.remove();
+    }
 }
+Pixel.activePixels = [];
+Pixel.MAX_PIXELS = 300;

package/dist/Spark.d.ts

@@ -0,0 +1,13 @@
+export declare class Spark {
+    private x;
+    private y;
+    private container;
+    private direction;
+    private gravitySpeed;
+    static activeSparks: Spark[];
+    private interval;
+    constructor(x: number, y: number);
+    private gravity;
+    destroy(): void;
+}
+//# sourceMappingURL=Spark.d.ts.map

package/dist/Spark.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spark.d.ts","sourceRoot":"","sources":["../src/Spark.ts"],"names":[],"mappings":"AAGA,qBAAa,KAAK;IAChB,OAAO,CAAC,CAAC,CAAS;IAClB,OAAO,CAAC,CAAC,CAAS;IAClB,OAAO,CAAC,SAAS,CAAM;IACvB,OAAO,CAAC,SAAS,CAA2B;IAC5C,OAAO,CAAC,YAAY,CAAa;IACjC,MAAM,CAAC,YAAY,EAAE,KAAK,EAAE,CAAM;IAClC,OAAO,CAAC,QAAQ,CAAM;gBAEV,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM;IAkChC,OAAO,CAAC,OAAO;IASR,OAAO;CAQf"}

package/dist/Spark.js

@@ -0,0 +1,48 @@
+// @ts-ignore - jQuery require
+const $ = require("jquery");
+export class Spark {
+    constructor(x, y) {
+        this.gravitySpeed = 0;
+        this.x = x;
+        this.y = y;
+        this.container = $(document.createElement("div"));
+        this.container.addClass("pixel");
+        const colors = ["#FFD700", "#FFA500", "#FF4500", "#FFFF00"];
+        const color = colors[Math.floor(Math.random() * colors.length)];
+        this.container.css({
+            background: color,
+            left: x + "px",
+            top: y + "px",
+            width: "3px",
+            height: "3px",
+            boxShadow: `0 0 4px ${color}`,
+            zIndex: 100,
+        });
+        $("body").append(this.container);
+        this.interval = setInterval(() => this.gravity(), 10);
+        const angle = Math.random() * Math.PI * 2;
+        const speed = 2 + Math.random() * 3;
+        this.direction = {
+            x: Math.cos(angle) * speed,
+            y: Math.sin(angle) * speed,
+        };
+        Spark.activeSparks.push(this);
+        setTimeout(() => this.destroy(), 200 + Math.random() * 200);
+    }
+    gravity() {
+        this.gravitySpeed += 0.1;
+        this.y += this.gravitySpeed + this.direction.y;
+        this.x += this.direction.x;
+        this.container.css("left", this.x + "px");
+        this.container.css("top", this.y + "px");
+    }
+    destroy() {
+        clearInterval(this.interval);
+        this.container.remove();
+        const index = Spark.activeSparks.indexOf(this);
+        if (index > -1) {
+            Spark.activeSparks.splice(index, 1);
+        }
+    }
+}
+Spark.activeSparks = [];

package/dist/index.d.ts

@@ -3,4 +3,7 @@ export { Tool } from "./types";
 export type { DestroyTheTextOptions } from "./types";
 export { DTTSounds } from "./DTTSounds";
 export { addStyles } from "./styles";
+export { Spark } from "./Spark";
+export { Pixel } from "./Pixel";
+export { Letra } from "./Letra";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC/B,YAAY,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC/B,YAAY,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACrC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC"}

package/dist/index.js

@@ -3,6 +3,9 @@ export { DestroyTheText } from "./DestroyTheText";
 export { Tool } from "./types";
 export { DTTSounds } from "./DTTSounds";
 export { addStyles } from "./styles";
+export { Spark } from "./Spark";
+export { Pixel } from "./Pixel";
+export { Letra } from "./Letra";
 // Initialize styles on import
 import { addStyles } from "./styles";
 addStyles();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "destroy-the-text",
-  "version": "2.0.0",
+  "version": "2.0.2",
   "description": "Destroy any text of your website. Easy to use. And very useless",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",