Updating linting rules

Lintfix existing code
Enforce linting on a commit to keep quality up in the future

.eslintrc.json

@@ -5,17 +5,18 @@
     },
     "extends": "airbnb-base",
     "globals": {
-        "Atomics": "readonly",
-        "SharedArrayBuffer": "readonly",
-        "PIXI": "readonly",
-        "jQuery": "readonly",
-        "TweenMax": "readonly",
+        "dragonBones": "readonly",
+        "ga": "readonly",
         "gsap": "readonly",
+        "jQuery": "readonly",
+        "Atomics": "readonly",
+        "BASIS": "readonly",
+        "CodeMirror": "readonly",
         "Linear": "readonly",
+        "PIXI": "readonly",
         "Quart": "readonly",
-        "CodeMirror": "readonly",
-        "ga": "readonly",
-        "dragonBones": "readonly"
+        "SharedArrayBuffer": "readonly",
+        "TweenMax": "readonly"
     },
     "parserOptions": {
         "ecmaVersion": 2018,
@@ -24,14 +25,17 @@
     "rules": {
         "indent": [1, 4, { "SwitchCase": 1, "VariableDeclarator": { "var": 1, "let": 1, "const": 1 } }],
         "linebreak-style": 0,
+        "max-classes-per-file": [2, 2],
         "max-len": [1, { "code": 200, "tabWidth": 4 }],
         "no-bitwise": 0,
         "no-console": 0,
+        "no-mixed-operators": 0,
         "no-multi-assign": 0,
         "no-param-reassign": 0,
         "no-plusplus": 0,
         "no-restricted-syntax": ["error", "ForInStatement", "LabeledStatement", "WithStatement"],
         "no-use-before-define": 0,
+        "no-underscore-dangle": [2, { "allowAfterThis": true }],
         "no-unused-vars": ["error", { "args": "none" }],
         "prefer-destructuring": 0
     }

examples/js/demos-advanced/slots.js

@@ -199,5 +199,5 @@ function lerp(a1, a2, t) {
 // Backout function from tweenjs.
 // https://github.com/CreateJS/TweenJS/blob/master/src/tweenjs/Ease.js
 function backout(amount) {
-    return t => (--t * t * ((amount + 1) * t + amount) + 1);
+    return (t) => (--t * t * ((amount + 1) * t + amount) + 1);
 }

examples/js/gsap2-interaction/gsap2-tint.js

@@ -52,4 +52,3 @@ app.stage.addChild(bunny3);
 TweenMax.to(bunny3, time, {
     pixi: { tint: 'rgb(0,0,255)' }, repeat: -1, yoyo: true,
 });
-

examples/js/gsap3-interaction/gsap3-basic.js

@@ -44,7 +44,9 @@ bunny4.x = 100;
 bunny4.anchor.set(0.5, 0.5);
 app.stage.addChild(bunny4);
 
-gsap.to(bunny4, { rotation: 2 * Math.PI, duration: time, repeat: -1, yoyo: true });
+gsap.to(bunny4, {
+    rotation: 2 * Math.PI, duration: time, repeat: -1, yoyo: true,
+});
 
 let colorBunny = null;
 createNewBunny();

examples/js/gsap3-interaction/gsap3-tint.js

@@ -11,6 +11,8 @@ const app = new PIXI.Application({
 
 document.body.appendChild(app.view);
 
+const i = 0;
+
 // Create a new texture
 const texture = PIXI.Texture.from('examples/assets/bunny.png');
 
@@ -52,4 +54,3 @@ app.stage.addChild(bunny3);
 gsap.to(bunny3, {
     pixi: { tint: 'rgb(0,0,255)' }, duration: time, repeat: -1, yoyo: true,
 });
-

examples/js/plugin-compressed-textures/basis.js

@@ -2,27 +2,26 @@
 // please look in README file of pixi-compressed-textures plugin by the link
 // https://github.com/pixijs/pixi-compressed-textures/blob/master/README.md
 
-var app = new PIXI.Application({
+const app = new PIXI.Application({
     width: window.innerWidth,
     height: window.innerHeight,
-    backgroundColor: 0x2c3e50
+    backgroundColor: 0x2c3e50,
 });
 
 document.body.appendChild(app.view);
 
-let loading = undefined;
+let loading;
 
 init();
 
 function init() {
-
-    loading = new PIXI.Text("Loading!", {stroke: 0xff2200});
+    loading = new PIXI.Text('Loading!', { stroke: 0xff2200 });
     app.stage.addChild(loading);
 
     // HACK! disable streaming, server not support WASM streaming
     WebAssembly.instantiateStreaming = undefined;
 
-    //wait before BASIS loads
+    // wait before BASIS loads
 
     BASIS().then(basisLoaded);
 }
@@ -37,15 +36,14 @@ function basisLoaded(Module) {
     // BasisFile may be is a proxied to worker, BASIS Loader is asynchonius
     PIXI.compressedTextures.BASISLoader.bindTranscoder(BasisFile, supp);
 
-    app.loader.baseUrl = "examples/assets/pixi-compressed-textures/basis/";
+    app.loader.baseUrl = 'examples/assets/pixi-compressed-textures/basis/';
     app.loader
-        .add("tree", "tree.basis")
-        .add("test", "t2k.basis")
+        .add('tree', 'tree.basis')
+        .add('test', 't2k.basis')
         .load(show);
 }
 
 function show() {
-
     const t = app.loader.resources.tree.texture;
     const tree = new PIXI.Sprite(t);
 
@@ -62,19 +60,15 @@ function show() {
     tree.x = test.x = app.renderer.width / 2;
     tree.y = test.y = app.renderer.height / 2;
 
-    const onLoad = ()=>{
-        loading.text =
-            " Tree(256):" + t.baseTexture.resource.type +
-            "\nPoster(2048):" + tt.baseTexture.resource.type;
-
+    const onLoad = () => {
+        loading.text = ` Tree(256):${t.baseTexture.resource.type
+        }\nPoster(2048):${tt.baseTexture.resource.type}`;
     };
 
     // basis use async loading, we need capture when textures was updated
-    t.baseTexture.on("update", onLoad);
-    tt.baseTexture.on("update", onLoad);
+    t.baseTexture.on('update', onLoad);
+    tt.baseTexture.on('update', onLoad);
 
 
     app.stage.addChild(tree, test);
-
-
 }

examples/js/plugin-heaven/decals.js

@@ -1,53 +1,53 @@
 // the plugin is here: https://github.com/gameofbombs/pixi-heaven/tree/master
 
-const app = new PIXI.Application({backgroundColor : 0x1099bb});
+const app = new PIXI.Application({ backgroundColor: 0x1099bb });
 document.body.appendChild(app.view);
 
 app.loader.add('bunny', 'examples/assets/bunny.png');
 app.loader.load(onComplete);
 
 function onComplete(loader, resources) {
-    let bunnyTex = resources['bunny'].texture;
+    const bunnyTex = resources.bunny.texture;
     bunnyTex.baseTexture.scaleMode = PIXI.SCALE_MODES.NEAREST;
 
-    let bunny = new PIXI.heaven.Sprite(bunnyTex);
+    const bunny = new PIXI.heaven.Sprite(bunnyTex);
     bunny.position.set(100, 100);
     bunny.scale.set(10);
 
     const W = bunny.width;
     const H = bunny.height;
 
-    let maskRT = PIXI.RenderTexture.create(W, H, 1);
-    let blackGraphics = new PIXI.Graphics();
+    const maskRT = PIXI.RenderTexture.create(W, H, 1);
+    const blackGraphics = new PIXI.Graphics();
     blackGraphics.beginFill(0);
     blackGraphics.drawRect(0, 0, W, H);
 
-    let whiteBunny = new PIXI.heaven.Sprite(bunnyTex);
+    const whiteBunny = new PIXI.heaven.Sprite(bunnyTex);
     whiteBunny.scale.set(10);
     whiteBunny.color.setDark(1.0, 1.0, 1.0);
     app.renderer.render(blackGraphics, maskRT, false);
     app.renderer.render(whiteBunny, maskRT, false);
 
-    let decalRT = PIXI.RenderTexture.create({ width: W, height: H, scaleMode: PIXI.SCALE_MODES.NEAREST});
-    let decals = new PIXI.Container();
-    for (let i=0;i<100; i++) {
-        let randomBunny = new PIXI.heaven.Sprite(bunnyTex);
+    const decalRT = PIXI.RenderTexture.create({ width: W, height: H, scaleMode: PIXI.SCALE_MODES.NEAREST });
+    const decals = new PIXI.Container();
+    for (let i = 0; i < 100; i++) {
+        const randomBunny = new PIXI.heaven.Sprite(bunnyTex);
         randomBunny.position.set(Math.random() * W | 0, Math.random() * H | 0);
         randomBunny.color.setLight(Math.random(), Math.random(), Math.random());
         randomBunny.color.setDark(Math.random(), Math.random(), Math.random());
         decals.addChild(randomBunny);
     }
     app.renderer.render(decals, decalRT);
 
-    let maskSprite = new PIXI.heaven.Sprite(maskRT);
-    let decalSprite = new PIXI.heaven.Sprite(decalRT);
+    const maskSprite = new PIXI.heaven.Sprite(maskRT);
+    const decalSprite = new PIXI.heaven.Sprite(decalRT);
 
     maskSprite.position = bunny.position;
     decalSprite.position = bunny.position;
     maskSprite.renderable = false;
-    //decalSprite.maskSprite = maskSprite;
-    //decalSprite.pluginName = 'spriteMasked';
-	decalSprite.mask = maskSprite;
+    // decalSprite.maskSprite = maskSprite;
+    // decalSprite.pluginName = 'spriteMasked';
+    decalSprite.mask = maskSprite;
 
     app.stage.addChild(bunny);
     app.stage.addChild(maskSprite);

examples/js/plugin-heaven/invert.js

@@ -1,10 +1,10 @@
 // the plugin is here: https://github.com/gameofbombs/pixi-heaven/tree/master
 
-const app = new PIXI.Application({backgroundColor : 0x1099bb});
+const app = new PIXI.Application({ backgroundColor: 0x1099bb });
 document.body.appendChild(app.view);
 
 // create a new Sprite from an image path
-let bunny = new PIXI.heaven.Sprite(PIXI.Texture.from('examples/assets/bunny.png'));
+const bunny = new PIXI.heaven.Sprite(PIXI.Texture.from('examples/assets/bunny.png'));
 
 // Let us invert the colors!
 bunny.color.setLight(0.0, 0.0, 0.0);
@@ -21,7 +21,7 @@ bunny.y = app.screen.height / 2;
 app.stage.addChild(bunny);
 
 // Listen for animate update
-app.ticker.add(function(delta) {
+app.ticker.add((delta) => {
     // just for fun, let's rotate mr rabbit a little
     // delta is 1 if running at 100% performance
     // creates frame-independent transformation

examples/js/plugin-heaven/polygon.js

@@ -1,23 +1,21 @@
 // the plugin is here: https://github.com/gameofbombs/pixi-heaven/tree/master
 
-const app = new PIXI.Application({backgroundColor: 0x1099bb, autoStart: false});
+const app = new PIXI.Application({ backgroundColor: 0x1099bb, autoStart: false });
 document.body.appendChild(app.view);
 
-var container = new PIXI.Container();
+const container = new PIXI.Container();
 app.stage.addChild(container);
 
 app.loader.add('dudes', 'examples/assets/polygon/dudes.json');
-app.loader.load(function (loader, resources) {
-    var keys = Object.keys(resources.dudes.textures);
-    var textures = keys.map(function (x) {
-        return resources.dudes.textures[x]
-    });
+app.loader.load((loader, resources) => {
+    const keys = Object.keys(resources.dudes.textures);
+    const textures = keys.map((x) => resources.dudes.textures[x]);
 
-// Create a 5x5 grid of bunnies
-    for (var i = 0; i < 25; i++) {
-        var bunny = new PIXI.heaven.Sprite(textures[i % textures.length]);
+    // Create a 5x5 grid of bunnies
+    for (let i = 0; i < 25; i++) {
+        const bunny = new PIXI.heaven.Sprite(textures[i % textures.length]);
 
-        let graphics = new PIXI.Graphics();
+        const graphics = new PIXI.Graphics();
         genWireframe(bunny, graphics);
         bunny.addChild(graphics);
 
@@ -28,11 +26,11 @@ app.loader.load(function (loader, resources) {
         container.addChild(bunny);
     }
 
-// Move container to the center
+    // Move container to the center
     container.x = app.screen.width / 2;
     container.y = app.screen.height / 2;
 
-// Center bunny sprite in local container coordinates
+    // Center bunny sprite in local container coordinates
     container.pivot.x = container.width / 2;
     container.pivot.y = container.height / 2;
 
@@ -42,12 +40,12 @@ app.loader.load(function (loader, resources) {
 function genWireframe(sprite, graphics) {
     sprite.calculateVertices();
 
-    let indices = sprite.indices;
-    let vertices = sprite.vertexData;
+    const indices = sprite.indices;
+    const vertices = sprite.vertexData;
 
-    graphics.lineStyle(4.0, Math.random()*0xffffff|0);
-    //generating it in current sprite world coords.
-    //they are local if sprite wasnt added yet
+    graphics.lineStyle(4.0, Math.random() * 0xffffff | 0);
+    // generating it in current sprite world coords.
+    // they are local if sprite wasnt added yet
     console.log(indices);
     console.log(vertices);
     for (let i = 0; i < indices.length; i += 3) {
@@ -63,7 +61,7 @@ function genWireframe(sprite, graphics) {
 }
 
 // Listen for animate update
-app.ticker.add(function (delta) {
+app.ticker.add((delta) => {
     // rotate the container!
     // use delta to create frame-independent transform
     container.rotation -= 0.01 * delta;

examples/js/plugin-heaven/spineboy-pro.js

@@ -38,14 +38,13 @@ function onAssetsLoaded(loader, res) {
         spineBoyPro.state.setAnimation(0, animation, loopAnimations.includes(animation));
 
         lastAnimation = animation;
-
     });
-	
-	
-	let phase = 0;
-	app.ticker.add(() => {
-		phase += 0.1;
-		let x = Math.sin(phase) * 0.25 + 0.25;
-		spineBoyPro.color.setDark(x, x, x);
-	});
+
+
+    let phase = 0;
+    app.ticker.add(() => {
+        phase += 0.1;
+        const x = Math.sin(phase) * 0.25 + 0.25;
+        spineBoyPro.color.setDark(x, x, x);
+    });
 }