Skip to content

Commit 49dac62

Browse files
jwagnerjwagner
committed
initial commit
0 parents  commit 49dac62

File tree

116 files changed

+2977
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

116 files changed

+2977
-0
lines changed

‎.editorconfig

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
# Don't allow rules from further up the tree.
2+
root = true
3+
4+
[*] # Every file
5+
end_of_line = lf # Unix sytle line endings
6+
insert_final_newline = true # Ensure a new line at the end of each file
7+
indent_style = space # Use spaces instead of tabs
8+
indent_size = 4 # Indent 4 spaces

‎.gitignore

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
blender
2+
build
3+
node_modules
4+
dist
5+
releases

‎.jshintrc

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
{
2+
"predef": [
3+
"describe",
4+
"it",
5+
"expect",
6+
"chai",
7+
"beforeEach",
8+
"afterEach",
9+
"before",
10+
"after"
11+
],
12+
"esnext": true,
13+
"globalstrict": true,
14+
"browser" : true,
15+
"worker" : true,
16+
"boss" : true,
17+
"eqeqeq": false,
18+
"evil": false,
19+
"eqnull": true,
20+
"forin": false,
21+
"laxbreak": false,
22+
"newcap": false,
23+
"noarg": true,
24+
"noempty": false,
25+
"nonew": false,
26+
"nomen": false,
27+
"plusplus": false,
28+
"regexp": false,
29+
"undef": true,
30+
"unused": "vars",
31+
"sub": true,
32+
"strict": false,
33+
"node": true,
34+
"white": false,
35+
"expr": true
36+
}

‎.npmignore

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
.*

‎CONTRIBUTING.md

+53
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
# How to contribute
2+
3+
## Reporting Bugs
4+
5+
When reporting a bug please provide all the information needed to quickly reproduce the problem.
6+
7+
This includes:
8+
- The browser & version used
9+
- A screenshot of http://webglreport.com/?v=1
10+
- A URL to reproduce the error
11+
- Other steps other necessary to reproduce the error
12+
13+
If I can't reproduce your problem it will likely not get fixed.
14+
15+
## Contributing Code
16+
17+
### Before Hacking
18+
To avoid wasting your time please communicate before starting to hack.
19+
Creating an issue describing your plans is a good start.
20+
21+
### Before submitting a pull request
22+
- Try to make your code look like the code around it.
23+
- Provide tests where appropriate.
24+
- Run JSHint on the files you changed, fix any issues related to your changes.
25+
- Run the tests, make sure they are green
26+
27+
### Please Avoid
28+
- Reformat my code to fit your personal preferences.
29+
30+
### License
31+
By contributing your code, you agree to license your contribution under the MIT License.
32+
33+
## Setting up the development environment
34+
Before you can start working you'll need to have node.js and git installed.
35+
```
36+
$ git clone
37+
$ cd normalmap.js
38+
$ npm install -g gulp jshint
39+
$ npm install
40+
$ gulp open
41+
```
42+
I work on GNU/Linux. Things might not work on windows.
43+
44+
## Running the tests
45+
There are some simple end to end tests to cover most of the functionality.
46+
47+
You can run them by opening the [/tests/](http://localhost:3000/tests/)
48+
folder after running gulp open.
49+
50+
The tests show the actual output next to the expected output and a diff.
51+
52+
## Code of Conduct
53+
None. Just be who you are.

‎LICENSE

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
Copyright (c) 2014 Jonas Wagner
2+
3+
Permission is hereby granted, free of charge, to any person obtaining a copy
4+
of this software and associated documentation files (the "Software"), to deal
5+
in the Software without restriction, including without limitation the rights
6+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
7+
copies of the Software, and to permit persons to whom the Software is
8+
furnished to do so, 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,
15+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
19+
SOFTWARE.

‎README.md

+80
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
:warning: **THIS IS EXPERIMENTAL SOFTWARE** :warning:
2+
3+
# ![normalmap.js](doc/gfx/logo-rendered.png)
4+
[API](doc/API.md) |
5+
[Example](#example) |
6+
[Installation](#installation) |
7+
[Changelog](doc/CHANGELOG.md) |
8+
[License](#license) (MIT) |
9+
[Questions?](#questions)
10+
11+
normalmap.js is a library for creating simple interactive lighting effects.
12+
13+
- Built on top of WebGL
14+
- Simple to use
15+
- Small (~7kb gzipped)
16+
- Fast enough to run on modern smartphones
17+
- There is a tiny jQuery plugin for simple usage
18+
- Covered by [automated end-to-end tests](https://29a.ch/sandbox/2016/normalmap.js/tests/)
19+
20+
# Demos
21+
[![Golden Dragon](doc/gfx/dragon.gif)](https://29a.ch/sandbox/2016/normalmap.js/)
22+
23+
Did you find a cool use for normalmap.js? [Let me know!](https://29a.ch/about)
24+
25+
# Example
26+
```javascript
27+
var lights = normalMap({
28+
canvas: canvas,
29+
normalMap: normalMap,
30+
baseColor: [0.5, 0.4, 0.5]
31+
});
32+
33+
lights.clear();
34+
35+
var position = normalMap.vec3(0.5, 0.5, 1.0); // dead center
36+
var color = normalMap.vec3(1.0, 1.0, 1.0); // bright white
37+
lights.addPointLight(position, color);
38+
```
39+
40+
# Installation
41+
With NPM:
42+
```
43+
$ npm install normalmap
44+
```
45+
46+
```javascript
47+
var normalmap = require('normalmap');
48+
```
49+
50+
With Bower:
51+
```$ bower install normalmap```
52+
53+
Or just download the latest zip file form the [releases page](https://github.com/jwagner/normalmap.js/releases).
54+
55+
Note that normalmap.js won't work with file:// urls. You will need to serve
56+
images from a webserver. See Richard Daveys [phaser introduction](http://phaser.io/tutorials/getting-started) for an explanations for this.
57+
58+
# Browser Support
59+
60+
Normalmap.js should work in all browsers that [supports WebGL](http://caniuse.com/#feat=webgl).
61+
62+
# API Documentation
63+
64+
[doc/API.md](doc/API.md)
65+
66+
# Changelog
67+
[doc/CHANGELOG.md](doc/CHANGELOG.md)
68+
69+
# Creating normal maps
70+
[NormalMap-Online](http://cpetry.github.io/NormalMap-Online/)
71+
72+
# Questions?
73+
Create a github issue or tweet to @29a_ch and please be a bit patient. :)
74+
75+
# License
76+
Copyright © 2016 Jonas Wagner.
77+
78+
The **source code** of this project licensed under the [MIT License](LICENSE) (enclosed).
79+
80+
The images and textures used for demonstration purposes are **not** licensed under the MIT License and belong to their respective owners.

‎bower.json

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
{
2+
"name": "normalmap",
3+
"description": "Interactive lighting effects using normal maps.",
4+
"main": "dist/normalmap.js",
5+
"authors": [
6+
"Jonas Wagner <[email protected]>"
7+
],
8+
"repository": "jwagner/normalmap.js",
9+
"license": "MIT",
10+
"keywords": [
11+
"normalmap",
12+
"light",
13+
"3d",
14+
"2d",
15+
"material",
16+
"effects"
17+
],
18+
"moduleType": [
19+
"amd",
20+
"globals",
21+
"node"
22+
],
23+
"homepage": "https://github.com/jwagner/normalmap.js/",
24+
"ignore": [
25+
"**/.*",
26+
"node_modules",
27+
"bower_components",
28+
"blender",
29+
"demos",
30+
"logo",
31+
"dist",
32+
"build",
33+
"tests",
34+
"releases"
35+
]
36+
}

‎build/dev/demos/tests

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
../../../tests/

‎build/release/demos/tests

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
../../../tests/

‎demos/_base.jade

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
doctype html
2+
html(lang="en")
3+
head
4+
- var root = 'https://29a.ch/sandbox/2016/normalmap.js/'
5+
- var name = 'normalmap.js'
6+
block beforeHead
7+
- var title = name + ' ' + demo
8+
- var description = name + " is a library to create interactive lighting and material effects with JavaScript."
9+
include _head.jade
10+
body
11+
include _header.jade
12+
block content
13+
script(src=fileRev('normalmap.js'))
14+
script(src=fileRev('jquery.min.js'))
15+
script(src=fileRev('jquery.normalmap.js'))
16+
script(src=fileRev('demo.js'))
17+
block afterScripts
18+
if(release)
19+
script
20+
| var _gaq = _gaq || [];
21+
| _gaq.push(['_setAccount', 'UA-5205069-2']);
22+
| _gaq.push(['_setDomainName', '29a.ch']);
23+
| _gaq.push(['_setSiteSpeedSampleRate', 50]);
24+
| _gaq.push(['_trackPageview']);
25+
script(src="//www.google-analytics.com/ga.js" async=true defer=true)

‎demos/_head.jade

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
meta(charset="utf-8")
2+
meta(http-equiv="X-UA-Compatible" content="IE=edge")
3+
link(href='//fonts.googleapis.com/css?family=Open+Sans:300,400', rel='stylesheet', type='text/css')
4+
link(rel='stylesheet', href=fileRev('demo.css'))
5+
meta(name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no")
6+
title= title + ' - 29a.ch'
7+
meta(name="apple-mobile-web-app-capable" content="yes")
8+
meta(name="apple-mobile-web-app-status-bar-style" content="black")
9+
meta(name="mobile-web-app-capable" content="yes")
10+
//-meta(name="robots" content="noindex,nofollow")
11+
meta(property="og:type" content="website")
12+
meta(property="og:description" content=description)
13+
meta(name="description" content=description)
14+
meta(property="og:title" content=title)
15+
meta(property="og:url" content=root + baseName)
16+
meta(property="og:image" content=root + fileRev('dragon.gif'))
17+
link(rel='canonical', href=root)

‎demos/_header.jade

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
.normalmap-demo-header
2+
h1
3+
small
4+
a(href=meta.homepage)= name
5+
| #{demo}
6+
block afterHeader
7+
//- h2 Under development - DO NOT SHARE THIS LINK.
8+
-
9+
var demos = [
10+
['Platinum Dragon', 'dragon'],
11+
['Stone Angel', 'lucy'],
12+
['Gold Buddah', 'buddah'],
13+
['Carbon Fiber', 'carbon'],
14+
['Helvetia Coin', 'index']
15+
];
16+
ul.normalmap-demo-nav.large-only
17+
- for demo in demos
18+
li
19+
a(href=demo[1]+'.html') #{demo[0]}
20+
select(onchange='if(this.value) location.href=this.value').normalmap-demo-mobile-nav.small-only
21+
option Change Demo
22+
- for demo in demos
23+
option(value=demo[1]+'.html') #{demo[0]}

‎demos/buddah.jade

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
extends ./_base.jade
2+
3+
block beforeHead
4+
- var demo = 'Gold Effect';
5+
6+
block afterHeader
7+
p Based on the Happy Buddah Model by <a href="http://graphics.stanford.edu/projects/faxing/happy/">Brian Curless and Marc Levoy - Stanford University</a>
8+
9+
block content
10+
canvas#c(style='padding: 1em 0')
11+
12+
block afterScripts
13+
script.
14+
jQuery(function($){
15+
$('#c')
16+
.normalmap({
17+
normalMap: '#{fileRev('gfx/buddah/normal.png')}',
18+
ambientMap: '#{fileRev('gfx/buddah/ambient.png')}',
19+
antiAliasing: true,
20+
singlePass: isMobile,
21+
//- baseColorMap: 'gfx/buddah_gold/ambient.png',
22+
metalness: 1.0,
23+
roughness: 0.25,
24+
subSurfaceScattering: 1,
25+
baseColor: normalmap.vec3(1.0, 0.6, 0.4),
26+
ambient: 1.0
27+
}).then(function(lights){
28+
var i = 0.5;
29+
bindLight(lights, { color: normalmap.vec3(i, i, i), zOffset: 1});
30+
});
31+
});

‎demos/carbon.jade

+40
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
extends ./_base.jade
2+
3+
block beforeHead
4+
- var demo = 'Carbon Fiber Effect';
5+
6+
block afterHeader
7+
p Based on <em>the 2x Herringbone twill Carbon Fiber</em> Material by <a href="http://www.blendswap.com/blends/view/73805">ThorntonJStrolia</a></p>
8+
9+
block content
10+
canvas#carbon
11+
12+
block afterScripts
13+
script.
14+
jQuery(function($){
15+
var dp = window.devicePixelRatio || 1.0;
16+
function resize(){
17+
$('#carbon').prop({
18+
width: $('#carbon').width()*dp,
19+
height: $('#carbon').height()*dp
20+
});
21+
}
22+
$(window).on('resize', resize);
23+
resize();
24+
$('#carbon')
25+
.normalmap({
26+
normalMap: '#{fileRev('gfx/carbon/normal.png')}',
27+
materialMap: '#{fileRev('gfx/carbon/material.png')}',
28+
// ambient: 0,
29+
metalness: 0.5,
30+
roughness: 0.8,
31+
baseColor: normalmap.vec3(0.0001, 0.0001, 0.0002),
32+
singlePass: true,
33+
repeat: true
34+
}).then(function(lights){
35+
bindLight(lights, {
36+
color: normalmap.vec3(0.75, 0.75, 0.75),
37+
zOffset: 4
38+
});
39+
});
40+
});

0 commit comments

Comments
 (0)