├── .gitignore ├── .npmignore ├── LICENSE.md ├── README.md ├── example ├── index.frag ├── index.js └── index.vert ├── index.glsl ├── index.html └── package.json /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | *.log 3 | .DS_Store 4 | bundle.js 5 | -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | *.log 3 | .DS_Store 4 | bundle.js 5 | test 6 | test.js 7 | index.html 8 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | This software is released under the MIT license: 2 | 3 | Permission is hereby granted, free of charge, to any person obtaining a copy of 4 | this software and associated documentation files (the "Software"), to deal in 5 | the Software without restriction, including without limitation the rights to 6 | use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of 7 | the Software, and to permit persons to whom the Software is furnished to do so, 8 | subject to the following conditions: 9 | 10 | The above copyright notice and this permission notice shall be included in all 11 | copies or substantial portions of the Software. 12 | 13 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 14 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS 15 | FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR 16 | COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER 17 | IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN 18 | CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 19 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # glsl-luma [![stable](http://badges.github.io/stability-badges/dist/stable.svg)](http://github.com/badges/stability-badges) 2 | 3 | Get the luma (brightness) of an RGB color in GLSL. Useful for converting images to greyscale. 4 | 5 | [![glsl-luma](http://imgur.com/7O5SbmC.png)](http://hughsk.io/glsl-luma) 6 | 7 | ## Usage 8 | 9 | [![NPM](https://nodei.co/npm/glsl-luma.png)](https://nodei.co/npm/glsl-luma/) 10 | 11 | ### `float value = luma(vec3 rgb)` 12 | ### `float value = luma(vec4 rgba)` 13 | 14 | Takes a `vec3` or `vec4` color as input, returning the luma as a `float`. 15 | 16 | ``` glsl 17 | precision mediump float; 18 | 19 | uniform sampler2D uTexture; 20 | varying vec2 vUv; 21 | 22 | #pragma glslify: luma = require(glsl-luma) 23 | 24 | void main() { 25 | vec4 color = texture2D(uTexture, vUv); 26 | float brightness = luma(color); 27 | 28 | gl_FragColor = vec4(vec3(brightness), 1.0); 29 | } 30 | ``` 31 | 32 | ## License 33 | 34 | MIT. See [LICENSE.md](http://github.com/hughsk/glsl-luma/blob/master/LICENSE.md) for details. 35 | -------------------------------------------------------------------------------- /example/index.frag: -------------------------------------------------------------------------------- 1 | precision mediump float; 2 | 3 | uniform sampler2D uTexture; 4 | varying vec2 vUv; 5 | 6 | #pragma glslify: luma = require(../) 7 | 8 | void main() { 9 | vec4 color = texture2D(uTexture, vUv); 10 | float brightness = luma(color); 11 | 12 | gl_FragColor = vec4(vec3(brightness), 1.0); 13 | } 14 | -------------------------------------------------------------------------------- /example/index.js: -------------------------------------------------------------------------------- 1 | var canvas = document.body.appendChild(document.createElement('canvas')) 2 | var triangle = require('a-big-triangle') 3 | var createContext = require('gl-context') 4 | var createTex2d = require('gl-texture2d') 5 | var glslify = require('glslify') 6 | var createShell = require('gl-now') 7 | var lena = require('lena') 8 | 9 | canvas.width = 512 10 | canvas.height = 512 11 | 12 | var gl = createContext(canvas, render) 13 | var tex = createTex2d(gl, lena) 14 | var shader = glslify({ 15 | vert: './index.vert' 16 | , frag: './index.frag' 17 | })(gl) 18 | 19 | function render() { 20 | shader.bind() 21 | shader.uniforms.uTexture = tex.bind(0) 22 | triangle(gl) 23 | } 24 | -------------------------------------------------------------------------------- /example/index.vert: -------------------------------------------------------------------------------- 1 | precision mediump float; 2 | 3 | attribute vec2 position; 4 | varying vec2 vUv; 5 | 6 | void main() { 7 | vUv = (position + vec2(1.0)) / 2.0; 8 | vUv.y = 1.0 - vUv.y; 9 | gl_Position = vec4(position, 1.0, 1.0); 10 | } 11 | -------------------------------------------------------------------------------- /index.glsl: -------------------------------------------------------------------------------- 1 | float luma(vec3 color) { 2 | return dot(color, vec3(0.299, 0.587, 0.114)); 3 | } 4 | 5 | float luma(vec4 color) { 6 | return dot(color.rgb, vec3(0.299, 0.587, 0.114)); 7 | } 8 | 9 | #pragma glslify: export(luma) 10 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | glsl-luma 6 | 7 | 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "glsl-luma", 3 | "version": "1.0.1", 4 | "description": "Get the luma (brightness) of an RGB color in GLSL. Useful for converting images to greyscale", 5 | "main": "index.js", 6 | "license": "MIT", 7 | "scripts": { 8 | "test": "cd example && beefy index.js --open", 9 | "bundle": "browserify example/index.js > bundle.js" 10 | }, 11 | "browserify": { 12 | "transform": [ 13 | "glslify" 14 | ] 15 | }, 16 | "author": "Hugh Kennedy (http://hughsk.io/)", 17 | "dependencies": {}, 18 | "devDependencies": { 19 | "a-big-triangle": "0.0.0", 20 | "gl-context": "^0.1.0", 21 | "gl-now": "^1.3.1", 22 | "gl-texture2d": "^1.0.1", 23 | "glslify": "^1.4.0", 24 | "lena": "^1.0.0" 25 | }, 26 | "repository": { 27 | "type": "git", 28 | "url": "git://github.com/hughsk/glsl-luma.git" 29 | }, 30 | "keywords": [ 31 | "glsl", 32 | "glslify", 33 | "grayscale", 34 | "greyscale", 35 | "luma", 36 | "brightness" 37 | ], 38 | "homepage": "https://github.com/hughsk/glsl-luma", 39 | "bugs": { 40 | "url": "https://github.com/hughsk/glsl-luma/issues" 41 | }, 42 | "directories": { 43 | "example": "example" 44 | } 45 | } 46 | --------------------------------------------------------------------------------