SHARE
TWEET

PIXI.js light & shadows

Iavra Aug 16th, 2016 (edited) 71 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. /*:
  2.  * @plugindesc v0.01
  3.  * <Iavra Lighting>
  4.  * @author Iavra
  5.  */
  6.  
  7. (function($, undefined) {
  8.     "use strict";
  9.  
  10.     /**
  11.      * Basic helper function to extend objects. Mainly used for inheritance and other prototype-related operations.
  12.      */
  13.     $._extend || ($._extend = function(b, e) { for(var k in e) { b[k] = e[k]; } return b; });
  14.  
  15.     //=============================================================================
  16.     // IAVRA.LIGHTING
  17.     //=============================================================================
  18.  
  19.     $.LIGHTING = {
  20.         Layer: function() { this.initialize(); },
  21.         RectangularToPolarFilter: function() { this.initialize(); },
  22.         PolarToRectangularFilter: function() { this.initialize(); }
  23.     }
  24.  
  25.     //=============================================================================
  26.     // IAVRA.LIGHTING.Layer
  27.     //=============================================================================
  28.  
  29.     $.LIGHTING.Layer.prototype = $._extend(Object.create(PIXI.Container.prototype), {
  30.  
  31.         initialize: function() {
  32.             PIXI.Container.call(this);
  33.  
  34.             //this.addChild(this._demo = PIXI.Sprite.fromImage('img/occlusion.png'));
  35.             this._occlusion = PIXI.Sprite.fromImage('img/occlusion.png');
  36.  
  37.             this._test = new PIXI.Sprite(PIXI.RenderTexture.create(500, 500));
  38.             this.addChild(this._test);
  39.             this._test.filters = [new $.LIGHTING.RectangularToPolarFilter(), new $.LIGHTING.PolarToRectangularFilter()];
  40.  
  41.             Window.x = 0;
  42.         },
  43.  
  44.         update: function() {
  45.             this._occlusion.x = Window.x;
  46.  
  47.             Graphics._renderer.render(this._occlusion, this._test.texture, true);
  48.         }
  49.  
  50.     });
  51.  
  52.     //=============================================================================
  53.     // IAVRA.LIGHTING.RectangularToPolarFilter
  54.     //=============================================================================
  55.  
  56.     /**
  57.      * First render pass used to create the shadow map from a given occluder map. Converts rectangular to polar
  58.      * coordinates and smears down the result as either transparent (shadow) or white (light).
  59.      */
  60.     $.LIGHTING.RectangularToPolarFilter.prototype = $._extend(Object.create(PIXI.Filter.prototype), {
  61.  
  62.         initialize: function() {
  63.             PIXI.Filter.call(this, null, [
  64.                 '#define PI 3.1415926535897932384626433832795',
  65.                 'precision highp float;',
  66.                 'varying vec2 vTextureCoord;',
  67.                 'uniform sampler2D uSampler;',
  68.                 'uniform mat3 mappedMatrix;',
  69.                 'uniform mat3 unmappedMatrix;',
  70.                 'const float h = 500.0;',
  71.                 'void main(void) {',
  72.                 '    vec3 mappedCoord = vec3(vTextureCoord, 1.0) * mappedMatrix;',
  73.                 '    for(float y = 0.0; y < h; y += 1.0) {',
  74.                 '        if(y / h > mappedCoord.y) { break; }',
  75.                 '        vec2 norm = vec2(mappedCoord.x, y / h) * 2.0 - 1.0;',
  76.                 '        float theta = PI + norm.x * PI;',
  77.                 '        float r = (1.0 + norm.y) * 0.5;',
  78.                 '        vec2 coord = vec2(-r * sin(theta), -r * cos(theta)) / 2.0 + 0.5;',
  79.                 '        vec3 unmappedCoord = vec3(coord, 1.0) * unmappedMatrix;',
  80.                 '        if(texture2D(uSampler, unmappedCoord.xy).a > 0.0) {',
  81.                 '            gl_FragColor = vec4(0.0);',
  82.                 '            return;',
  83.                 '        }',
  84.                 '    }',
  85.                 '    gl_FragColor = vec4(1.0);',
  86.                 '}'
  87.             ].join('\n'));
  88.             this.uniforms.mappedMatrix = new PIXI.Matrix();
  89.             this.uniforms.unmappedMatrix = new PIXI.Matrix();
  90.             this.padding = 0;
  91.         },
  92.  
  93.         apply: function(filterManager, input, output) {
  94.             filterManager.calculateNormalizedScreenSpaceMatrix(this.uniforms.mappedMatrix);
  95.             this.uniforms.mappedMatrix.copy(this.uniforms.unmappedMatrix).invert();
  96.             filterManager.applyFilter(this, input, output);
  97.         }
  98.  
  99.     });
  100.  
  101.     //=============================================================================
  102.     // IAVRA.LIGHTING.PolarToRectangularFilter
  103.     //=============================================================================
  104.  
  105.     /**
  106.      * Second render pass used to create the shadow map from a given occluder map. Converts polar to rectangular
  107.      * coordinates, which unwraps the shadow map created in the first step.
  108.      */
  109.     $.LIGHTING.PolarToRectangularFilter.prototype = $._extend(Object.create(PIXI.Filter.prototype), {
  110.  
  111.         initialize: function() {
  112.             PIXI.Filter.call(this, null, [
  113.                 '#define PI 3.1415926535897932384626433832795',
  114.                 'precision highp float;',
  115.                 'varying vec2 vTextureCoord;',
  116.                 'uniform sampler2D uSampler;',
  117.                 'uniform vec4 filterClamp;',
  118.                 'uniform mat3 mappedMatrix;',
  119.                 'uniform mat3 unmappedMatrix;',
  120.                 'void main(void) {',
  121.                 '    vec2 norm = (vec3(vTextureCoord, 1.0) * mappedMatrix).xy * 2.0 - 1.0;',
  122.                 '    float theta = PI + atan(norm.x, norm.y);',
  123.                 '    float r = length(norm);',
  124.                 '    vec2 coord = vec2(theta / (2.0 * PI), r);',
  125.                 '    vec2 unmappedCoord = (vec3(coord, 1.0) * unmappedMatrix).xy;',
  126.                 '    gl_FragColor = texture2D(uSampler, clamp(unmappedCoord, filterClamp.xy, filterClamp.zw));',
  127.                 '}'
  128.             ].join('\n'));
  129.             this.uniforms.mappedMatrix = new PIXI.Matrix();
  130.             this.uniforms.unmappedMatrix = new PIXI.Matrix();
  131.         },
  132.  
  133.         apply: function(filterManager, input, output) {
  134.             filterManager.calculateNormalizedScreenSpaceMatrix(this.uniforms.mappedMatrix);
  135.             this.uniforms.mappedMatrix.copy(this.uniforms.unmappedMatrix).invert();
  136.             filterManager.applyFilter(this, input, output);
  137.         }
  138.  
  139.     });
  140.  
  141.     //=============================================================================
  142.     // Spriteset_Map
  143.     //=============================================================================
  144.  
  145.     var _spritesetMap_createUpperLayer = Spriteset_Map.prototype.createUpperLayer;
  146.     Spriteset_Map.prototype.createUpperLayer = function() {
  147.         this.addChild(new $.LIGHTING.Layer());
  148.         _spritesetMap_createUpperLayer.call(this);
  149.     };
  150.  
  151. })(this.IAVRA || (this.IAVRA = {}));
  152.  
  153. /*
  154. '#define PI 3.1415926535897932384626433832795',
  155. 'varying vec2 vTextureCoord;',
  156. 'uniform sampler2D uSampler;',
  157. 'uniform mat3 mappedMatrix;',
  158. 'uniform mat3 unmappedMatrix;',
  159. 'void main(void) {',
  160. '    vec2 norm = (vec3(vTextureCoord, 1.0) * mappedMatrix).xy * 2.0 - 1.0;',
  161. '    float theta = PI + norm.x * PI;',
  162. '    float r = (1.0 + norm.y) * 0.5;',
  163. '    vec2 coord = vec2(-r * sin(theta), -r * cos(theta)) / 2.0 + 0.5;',
  164. '    gl_FragColor = texture2D(uSampler, (vec3(coord, 1.0) * unmappedMatrix).xy);',
  165. '}'
  166. */
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top