redistributing

pull/63/head
Patricio Gonzalez Vivo 8 years ago
parent 6d20480e5e
commit 871adb32c7

@ -44,7 +44,8 @@ Since each subdivision or cell is a smaller version of the normalized coordinate
* Recreate more complicated patterns by composing different shapes.
<a href="../edit.html#09/diamondtiles.frag"><canvas id="custom" class="canvas" data-fragment-url="diamondtiles.frag" width="520px" height="200px"></canvas></a>
[![](diamondtiles-long.png)](../edit.html#09/diamondtiles.frag)
* Combine different layers of patterns to compose your own [Scottish Tartan Patterns](https://www.google.com/search?q=scottish+patterns+fabric&tbm=isch&tbo=u&source=univ&sa=X&ei=Y1aFVfmfD9P-yQTLuYCIDA&ved=0CB4QsAQ&biw=1399&bih=799#tbm=isch&q=Scottish+Tartans+Patterns).

@ -122,7 +122,7 @@ Noise 算法的设计初衷是将难以言说的自然质感转化成数字图
就像一个画家非常了解画上的颜料是如何晕染的,我们越了解 noise 是如何运作的,越能更好地使用 noise。比如如果我们要用一个二维的 noise 来旋转空间中的直线,我们就可以制作下图的旋涡状效果,看起来就像木头表皮一样。同样地,你可以点击图片查看代码。
[ ![Wood texture](wood.png) ](../edit.html#11/wood.frag)
[ ![Wood texture](wood-long.png) ](../edit.html#11/wood.frag)
```glsl
pos = rotate2d( noise(pos) ) * pos; // 旋转空间
@ -131,7 +131,7 @@ Noise 算法的设计初衷是将难以言说的自然质感转化成数字图
另一种用 noise 制作有趣的图案的方式是用 distance field距离场处理它用用 [第七章](../07/)提到的招数。
[ ![Splatter texture](splatter.png) ](../edit.html#11/splatter.frag)
[ ![Splatter texture](splatter-long.png) ](../edit.html#11/splatter.frag)
```glsl
color += smoothstep(.15,.2,noise(st*10.)); // 黑色的泼溅点

@ -124,7 +124,7 @@ y = mix(rand(i), rand(i + 1.0), u); // using it in the interpolation
絵の具の中の顔料の働きを理解している画家のように、ノイズの実装方法について詳しくなるほど、より上手に使いこなせるようになります。例えば複数の直線が描かれた空間を回転させるために二次元のノイズを使うと下記の通り、木目のように見える渦巻き状の効果を作り出すことができます。画像をクリックするとコードも見ることができます。
[ ![Wood texture](wood.png) ](../edit.html#11/wood.frag)
[ ![Wood texture](wood-long.png) ](../edit.html#11/wood.frag)
```glsl
pos = rotate2d( noise(pos) ) * pos; // rotate the space
@ -133,7 +133,7 @@ y = mix(rand(i), rand(i + 1.0), u); // using it in the interpolation
イズから面白いパターンを作り出すもう1つの方法は、イズをディスタンスフィールドのように扱い、[形について](../07/)の章で取り上げたテクニックを応用することです。
[ ![Splatter texture](splatter.png) ](../edit.html#11/splatter.frag)
[ ![Splatter texture](splatter-long.png) ](../edit.html#11/splatter.frag)
```glsl
color += smoothstep(.15,.2,noise(st*10.)); // Black splatter

@ -123,7 +123,7 @@ Take a minute to look at these two examples by [Inigo Quilez](http://www.iquilez
Like a painter who understands how the pigments of their paints work, the more we know about noise implementations the better we will be able to use them. For example, if we use a two dimensional noise implementation to rotate the space where straight lines are rendered, we can produce the following swirly effect that looks like wood. Again you can click on the image to see what the code looks like.
[ ![Wood texture](wood.png) ](../edit.html#11/wood.frag)
[ ![Wood texture](wood-long.png) ](../edit.html#11/wood.frag)
```glsl
pos = rotate2d( noise(pos) ) * pos; // rotate the space
@ -132,7 +132,7 @@ Like a painter who understands how the pigments of their paints work, the more w
Another way to get interesting patterns from noise is to treat it like a distance field and apply some of the tricks described in the [Shapes chapter](../07/).
[ ![Splatter texture](splatter.png) ](../edit.html#11/splatter.frag)
[ ![Splatter texture](splatter-long.png) ](../edit.html#11/splatter.frag)
```glsl
color += smoothstep(.15,.2,noise(st*10.)); // Black splatter

Binary file not shown.

Before

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 67 KiB

@ -1,5 +0,0 @@
## "Hello World!"
Usually the "Hello world!" example is the first step to learning a new language. In GPU-land rendering text is an overcomplicated task for a first step, instead we'll choose a bright welcoming color to shout our enthusiasm!
Read ["Hello World!"](../02) to learn more.

@ -1,32 +0,0 @@
<?php
$path = "../..";
$subtitle = ": Gallery - Shaping functions";
$README = "README";
$language = "";
if ( !empty($_GET['lan']) ) {
if (file_exists($README.'-'.$_GET['lan'].'.md')) {
$language = '-'.$_GET['lan'];
$README .= $language;
}
}
include("../header.php");
include("../../chap-header.php");
echo '<div id="content">';
include("../../src/parsedown/Parsedown.php");
$Parsedown = new Parsedown();
echo $Parsedown->text(file_get_contents($README.'.md'));
$dir = basename(__DIR__);
echo "<div class=\"glslChapterGallery\" log=\"{$dir}\"></div>";
echo '
</div>
<hr>
<ul class="navigationBar" >
<li class="navigationBar" onclick="window.location.href=\'../index.php\'">Gallery Home </li>
</ul>';
include("../../footer.php");
?>

@ -1,11 +0,0 @@
## Uniforms
Learn how to use Uniform variables. Uniform variables, or simply *uniforms* are the variables that carry information equally accessible from all of the threads of your shader. The [GSLS editor](http://editor.thebookofshaders.com/) has three uniforms set up for you.
Read [Uniforms](../03) to learn more.
```glsl
uniform vec2 u_resolution; // Canvas size (width,height)
uniform vec2 u_mouse; // mouse position in screen pixels
uniform float u_time; // Time in seconds since load
```

@ -1,32 +0,0 @@
<?php
$path = "../..";
$subtitle = ": Gallery - Shaping functions";
$README = "README";
$language = "";
if ( !empty($_GET['lan']) ) {
if (file_exists($README.'-'.$_GET['lan'].'.md')) {
$language = '-'.$_GET['lan'];
$README .= $language;
}
}
include("../header.php");
include("../../chap-header.php");
echo '<div id="content">';
include("../../src/parsedown/Parsedown.php");
$Parsedown = new Parsedown();
echo $Parsedown->text(file_get_contents($README.'.md'));
$dir = basename(__DIR__);
echo "<div class=\"glslChapterGallery\" log=\"{$dir}\"></div>";
echo '
</div>
<hr>
<ul class="navigationBar" >
<li class="navigationBar" onclick="window.location.href=\'../index.php\'">Gallery Home </li>
</ul>';
include("../../footer.php");
?>

@ -1,5 +0,0 @@
## Shaping functions
Shaping functions is fundamental technique that is recursively used throughout this book that let you control the variation of the value at will. Study how different functions of x are used to create different shapes and try making your own function.
Read [Shaping functions](../05) to learn more.

@ -1,32 +0,0 @@
<?php
$path = "../..";
$subtitle = ": Gallery - Shaping functions";
$README = "README";
$language = "";
if ( !empty($_GET['lan']) ) {
if (file_exists($README.'-'.$_GET['lan'].'.md')) {
$language = '-'.$_GET['lan'];
$README .= $language;
}
}
include("../header.php");
include("../../chap-header.php");
echo '<div id="content">';
include("../../src/parsedown/Parsedown.php");
$Parsedown = new Parsedown();
echo $Parsedown->text(file_get_contents($README.'.md'));
$dir = basename(__DIR__);
echo "<div class=\"glslChapterGallery\" log=\"{$dir}\"></div>";
echo '
</div>
<hr>
<ul class="navigationBar" >
<li class="navigationBar" onclick="window.location.href=\'../index.php\'">Gallery Home </li>
</ul>';
include("../../footer.php");
?>

@ -1,6 +0,0 @@
## Colors
Familiarize yourself with how to express colors in shaders. The examples cover how to mix colors and beautifully animate them over time as well as conversion between two different models(RGB and HSB).
In GLSL, colors are simply just vectors, which means you can easily apply the concepts and techniques you learn here to other
Read [Colors](../06) to learn more.

@ -1,32 +0,0 @@
<?php
$path = "../..";
$subtitle = ": Gallery - Shaping functions";
$README = "README";
$language = "";
if ( !empty($_GET['lan']) ) {
if (file_exists($README.'-'.$_GET['lan'].'.md')) {
$language = '-'.$_GET['lan'];
$README .= $language;
}
}
include("../header.php");
include("../../chap-header.php");
echo '<div id="content">';
include("../../src/parsedown/Parsedown.php");
$Parsedown = new Parsedown();
echo $Parsedown->text(file_get_contents($README.'.md'));
$dir = basename(__DIR__);
echo "<div class=\"glslChapterGallery\" log=\"{$dir}\"></div>";
echo '
</div>
<hr>
<ul class="navigationBar" >
<li class="navigationBar" onclick="window.location.href=\'../index.php\'">Gallery Home </li>
</ul>';
include("../../footer.php");
?>

@ -1,5 +0,0 @@
## Shapes
Let's look at how to draw simple shapes in a parallel procedural way. In a nutshell, all you need to do is to determine if each pixel belongs to the shape you want to draw or not, and apply different colors accordingly. You can use coordinate system like a grid paper to draw rectangles and squares. We'll look at more advanced concept called distance field to draw more complex shapes.
Read [Shapes](../07) to learn more.

@ -1,32 +0,0 @@
<?php
$path = "../..";
$subtitle = ": Gallery - Shaping functions";
$README = "README";
$language = "";
if ( !empty($_GET['lan']) ) {
if (file_exists($README.'-'.$_GET['lan'].'.md')) {
$language = '-'.$_GET['lan'];
$README .= $language;
}
}
include("../header.php");
include("../../chap-header.php");
echo '<div id="content">';
include("../../src/parsedown/Parsedown.php");
$Parsedown = new Parsedown();
echo $Parsedown->text(file_get_contents($README.'.md'));
$dir = basename(__DIR__);
echo "<div class=\"glslChapterGallery\" log=\"{$dir}\"></div>";
echo '
</div>
<hr>
<ul class="navigationBar" >
<li class="navigationBar" onclick="window.location.href=\'../index.php\'">Gallery Home </li>
</ul>';
include("../../footer.php");
?>

@ -1,6 +0,0 @@
## Matrix
Matrix is a very powerful tool for manipulating vectors. By mastering how to use matrices, you can freely translate, scale and rotate shapes. Since the technique can be equally applied to anything expressed by vectors, we will look at many more advanced use of matrices later in this book.
Matrices may look complex at a first glance, but you'll find it very handy and useful as you get used to the concept. Let's practice here and learn basics with simple examples.
Read [Matrix](../08) to learn more.

@ -1,32 +0,0 @@
<?php
$path = "../..";
$subtitle = ": Gallery - Shaping functions";
$README = "README";
$language = "";
if ( !empty($_GET['lan']) ) {
if (file_exists($README.'-'.$_GET['lan'].'.md')) {
$language = '-'.$_GET['lan'];
$README .= $language;
}
}
include("../header.php");
include("../../chap-header.php");
echo '<div id="content">';
include("../../src/parsedown/Parsedown.php");
$Parsedown = new Parsedown();
echo $Parsedown->text(file_get_contents($README.'.md'));
$dir = basename(__DIR__);
echo "<div class=\"glslChapterGallery\" log=\"{$dir}\"></div>";
echo '
</div>
<hr>
<ul class="navigationBar" >
<li class="navigationBar" onclick="window.location.href=\'../index.php\'">Gallery Home </li>
</ul>';
include("../../footer.php");
?>

@ -1,5 +0,0 @@
## Patterns
Repetitive patterns are perfect theme for computational sketching. Different from conventional way of drawing, shaders lets you draw everything parallelly at once. Instead of repeating the same procedure many times, you will wrap and repeat the "space". Sounds like Sci-Fi? Let's find out what it really means.
Read [Patterns](../09) to learn more.

@ -1,32 +0,0 @@
<?php
$path = "../..";
$subtitle = ": Gallery - Shaping functions";
$README = "README";
$language = "";
if ( !empty($_GET['lan']) ) {
if (file_exists($README.'-'.$_GET['lan'].'.md')) {
$language = '-'.$_GET['lan'];
$README .= $language;
}
}
include("../header.php");
include("../../chap-header.php");
echo '<div id="content">';
include("../../src/parsedown/Parsedown.php");
$Parsedown = new Parsedown();
echo $Parsedown->text(file_get_contents($README.'.md'));
$dir = basename(__DIR__);
echo "<div class=\"glslChapterGallery\" log=\"{$dir}\"></div>";
echo '
</div>
<hr>
<ul class="navigationBar" >
<li class="navigationBar" onclick="window.location.href=\'../index.php\'">Gallery Home </li>
</ul>';
include("../../footer.php");
?>

@ -1,5 +0,0 @@
## Random
Life is boring if everything was predictable. Though nothing is truly random in computers, we can create pseudo-randomness that looks totally unpredictable using simple tricks to create more interesting patterns and behaviors.
Read [Random](../10) to learn more.

@ -1,32 +0,0 @@
<?php
$path = "../..";
$subtitle = ": Gallery - Shaping functions";
$README = "README";
$language = "";
if ( !empty($_GET['lan']) ) {
if (file_exists($README.'-'.$_GET['lan'].'.md')) {
$language = '-'.$_GET['lan'];
$README .= $language;
}
}
include("../header.php");
include("../../chap-header.php");
echo '<div id="content">';
include("../../src/parsedown/Parsedown.php");
$Parsedown = new Parsedown();
echo $Parsedown->text(file_get_contents($README.'.md'));
$dir = basename(__DIR__);
echo "<div class=\"glslChapterGallery\" log=\"{$dir}\"></div>";
echo '
</div>
<hr>
<ul class="navigationBar" >
<li class="navigationBar" onclick="window.location.href=\'../index.php\'">Gallery Home </li>
</ul>';
include("../../footer.php");
?>

@ -1,6 +0,0 @@
## Noise
How can we create more natural looking textures like surface of the roads, rocks, trees and clouds? Noise function is the answer.
Since Ken Perlin invented his first noise algorithm in 80s, the technique has been extensively used throughout computer graphics and simulations. Even if you have never heard of the name, it's not possible you have never seen it. Let's look step by step at how the function is built and works. We also cover more efficient version of the algorithm called simplex noise.
Read [Noise](../11) to learn more.

@ -1,32 +0,0 @@
<?php
$path = "../..";
$subtitle = ": Gallery - Shaping functions";
$README = "README";
$language = "";
if ( !empty($_GET['lan']) ) {
if (file_exists($README.'-'.$_GET['lan'].'.md')) {
$language = '-'.$_GET['lan'];
$README .= $language;
}
}
include("../header.php");
include("../../chap-header.php");
echo '<div id="content">';
include("../../src/parsedown/Parsedown.php");
$Parsedown = new Parsedown();
echo $Parsedown->text(file_get_contents($README.'.md'));
$dir = basename(__DIR__);
echo "<div class=\"glslChapterGallery\" log=\"{$dir}\"></div>";
echo '
</div>
<hr>
<ul class="navigationBar" >
<li class="navigationBar" onclick="window.location.href=\'../index.php\'">Gallery Home </li>
</ul>';
include("../../footer.php");
?>

@ -1,3 +0,0 @@
## Advanced examples
In this section, we gathered relatively advanced examples from different chapters. Try if you can read and understand all the examples here to test yourself.

@ -1,32 +0,0 @@
<?php
$path = "../..";
$subtitle = ": Gallery - Shaping functions";
$README = "README";
$language = "";
if ( !empty($_GET['lan']) ) {
if (file_exists($README.'-'.$_GET['lan'].'.md')) {
$language = '-'.$_GET['lan'];
$README .= $language;
}
}
include("../header.php");
include("../../chap-header.php");
echo '<div id="content">';
include("../../src/parsedown/Parsedown.php");
$Parsedown = new Parsedown();
echo $Parsedown->text(file_get_contents($README.'.md'));
$dir = basename(__DIR__);
echo "<div class=\"glslChapterGallery\" log=\"{$dir}\"></div>";
echo '
</div>
<hr>
<ul class="navigationBar" >
<li class="navigationBar" onclick="window.location.href=\'../index.php\'">Gallery Home </li>
</ul>';
include("../../footer.php");
?>

@ -1,45 +0,0 @@
<?php
// main menu
echo '
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>The Book of Shaders'.$subtitle.'</title>
<link href="/favicon.gif" rel="shortcut icon"/>
<meta name="keywords" content="shader,openGL,WebGL,GLSL,book,procedural,generative" />
<meta name="description" content="Gentle step-by-step guide through the abstract and complex universe of Fragment Shaders." />
<meta name="twitter:site" content="@bookofshaders">
<meta name="twitter:title" content="The Book Of Shaders">
<meta name="twitter:description" content="Gentle step-by-step guide through the abstract and complex universe of Fragment Shaders.">
<meta name="twitter:creator" content="@patriciogv">
<meta name="twitter:domain" content="thebookofshaders.edu">
<link href="/favicon.gif" rel="shortcut icon"/>
<!-- Highlight -->
<link type="text/css" rel="stylesheet" href="'.$path.'/css/github.css">
<script type="text/javascript" src="'.$path.'/src/highlight.min.js"></script>
<!-- Jquery -->
<script src="//code.jquery.com/jquery-2.2.1.min.js"></script>
<!-- Gallery -->
<link type="text/css" rel="stylesheet" href="'.$path.'/examples_proto/css/gallery.css">
<script type="application/javascript" src="'.$path.'/examples_proto/src/glslGallery.js"></script>
<script type="application/javascript" src="'.$path.'/examples_proto/src/examples.js"></script>
<link type="text/css" rel="stylesheet" href="'.$path.'/css/style.css">
';
if ( $language !== '' && file_exists($path.'/css/style'.$language.'.css') ) {
echo '<link type="text/css" rel="stylesheet" href="'.$path.'/css/style'.$language.'.css">';
}
echo '
</head>
<body>
';
?>

@ -12,9 +12,14 @@
}
}
include("./header.php");
include("../header.php");
include("../chap-header.php");
echo '
<!-- Gallery -->
<script type="application/javascript" src="'.$path.'/examples_proto/src/examples.js"></script>
';
echo '<div id="content" class="gallery-top">';
include($path."/src/parsedown/Parsedown.php");
$Parsedown = new Parsedown();

@ -1,77 +0,0 @@
// Author @patriciogv - 2015
// http://patriciogonzalezvivo.com
#ifdef GL_ES
precision mediump float;
#endif
#define PI 3.1415926535
#define HALF_PI 1.57079632679
uniform vec2 u_resolution;
uniform float u_time;
uniform sampler2D u_tex0;
uniform vec2 u_tex0Resolution;
float speedMoon = 0.01;
float speedSun = 0.25;
vec3 sphereNormals(in vec2 uv) {
uv = fract(uv)*2.0-1.0;
vec3 ret;
ret.xy = sqrt(uv * uv) * sign(uv);
ret.z = sqrt(abs(1.0 - dot(ret.xy,ret.xy)));
ret = ret * 0.5 + 0.5;
return mix(vec3(0.0), ret, smoothstep(1.0,0.98,dot(uv,uv)) );
}
vec2 sphereCoords(vec2 _st, float _scale){
float maxFactor = sin(1.570796327);
vec2 uv = vec2(0.0);
vec2 xy = 2.0 * _st.xy - 1.0;
float d = length(xy);
if (d < (2.0-maxFactor)){
d = length(xy * maxFactor);
float z = sqrt(1.0 - d * d);
float r = atan(d, z) / 3.1415926535 * _scale;
float phi = atan(xy.y, xy.x);
uv.x = r * cos(phi) + 0.5;
uv.y = r * sin(phi) + 0.5;
} else {
uv = _st.xy;
}
return uv;
}
vec4 sphereTexture(in sampler2D _tex, in vec2 _uv) {
vec2 st = sphereCoords(_uv, 1.0);
float aspect = u_tex0Resolution.y/u_tex0Resolution.x;
st.x = fract(st.x*aspect + u_time*speedMoon);
return texture2D(_tex, st);
}
void main(){
vec2 st = gl_FragCoord.xy/u_resolution.xy;
vec3 color = vec3(1.0);
color *= sphereTexture(u_tex0, st).rgb;
// Calculate sun direction
vec3 sunPos = normalize(vec3(cos(u_time*speedSun-HALF_PI),0.0,sin(speedSun*u_time-HALF_PI)));
vec3 surface = normalize(sphereNormals(st)*2.0-1.0);
// Add Shadows
color *= dot(sunPos,surface);
// Blend black the edge of the sphere
float radius = 1.0-length( vec2(0.5)-st )*2.0;
color *= smoothstep(0.001,0.05,radius);
color = 1.0-color;
gl_FragColor = vec4(color,1.0);
}

@ -1,3 +0,0 @@
## Featured shaders
Featured examples shared by our readers and students. We are looking forward to see a lot more shaders created with the [GLSL editor](http://editor.thebookofshaders.com/). Please share your masterpiecess to [@bookofshaders](https://twitter.com/bookofshaders).

@ -1,32 +0,0 @@
<?php
$path = "../..";
$subtitle = ": Gallery - Shaping functions";
$README = "README";
$language = "";
if ( !empty($_GET['lan']) ) {
if (file_exists($README.'-'.$_GET['lan'].'.md')) {
$language = '-'.$_GET['lan'];
$README .= $language;
}
}
include("../header.php");
include("../../chap-header.php");
echo '<div id="content">';
include("../../src/parsedown/Parsedown.php");
$Parsedown = new Parsedown();
echo $Parsedown->text(file_get_contents($README.'.md'));
$dir = basename(__DIR__);
echo "<div class=\"glslChapterGallery\" log=\"{$dir}\"></div>";
echo '
</div>
<hr>
<ul class="navigationBar" >
<li class="navigationBar" onclick="window.location.href=\'../index.php\'">Gallery Home </li>
</ul>';
include("../../footer.php");
?>

@ -41,6 +41,16 @@ if (file_exists($path."/src/glslEditor/build/glslEditor.js")) {
<link type="text/css" rel="stylesheet" href="http://patriciogonzalezvivo.com/glslEditor/build/glslEditor.css">
<script type="application/javascript" src="http://patriciogonzalezvivo.com/glslEditor/build/glslEditor.js"></script>';
}
if (file_exists($path."/src/glslGallery/build/glslGallery.js")) {
echo '
<link type="text/css" rel="stylesheet" href="'.$path.'/src/glslGallery/build/glslGallery.css">
<script type="application/javascript" src="'.$path.'/src/glslGallery/build/glslGallery.js"></script>';
} else {
echo '
<link type="text/css" rel="stylesheet" href="http://patriciogonzalezvivo.com/glslGallery/build/glslGallery.css">
<script type="application/javascript" src="http://patriciogonzalezvivo.com/glslGallery/build/glslGallery.js"></script>';
}
echo '
<link type="text/css" rel="stylesheet" href="'.$path.'/css/style.css">

@ -1,55 +1,53 @@
import os
import os.path
import re
import subprocess
def injectShaderBlocks( _folder, _text ):
rta = ""
lines = _text.split('\n');
for line in lines:
if line.find('<canvas id=\"custom\" class=\"canvas\"') >= 0:
shaderFile = re.search("<canvas id=\"custom\" class=\"canvas\" data-fragment-url=\"(.*?)\"", line.rstrip(), re.S).group(1)
shaderName, shaderExt = os.path.splitext(shaderFile)
shaderPath = folder+"/"+shaderFile;
shaderString = open(shaderPath, 'r').read()
shaderImage = folder+"/"+shaderName+".png"
shaderCommand = "glslViewer " + shaderPath + " " + \
" -s 0.5 -o " + shaderImage
print shaderCommand
returnCode = subprocess.call(shaderCommand, shell=True)
elif line.find('<div class=\"codeAndCanvas\"') >= 0:
shaderTextureResults = re.findall(r'<div class=\"codeAndCanvas\" data=\".*\" data-imgs=\"(.*)\"></div>', line.rstrip())
shaderFile = re.sub(r'<div class=\"codeAndCanvas\" data=\"(.*?)\"(>| .+>)</div>', r'\1', line.rstrip())
shaderName,shaderExt = os.path.splitext(shaderFile)
shaderPath = folder+"/"+shaderFile;
if shaderTextureResults:
shaderTexturePaths = map (lambda f: folder+"/"+f, shaderTextureResults[0].split(","))
else:
shaderTexturePaths = []
shaderString = open(shaderPath, 'r').read()
shaderImage = folder+"/"+shaderName+".png"
shaderCommand = "glslViewer " + shaderPath + " " + \
" ".join(shaderTexturePaths) + \
" -s 0.5 -o " + shaderImage
print shaderCommand
returnCode = subprocess.call(shaderCommand, shell=True)
d='.'
import glob, os, re, subprocess
# def injectShaderBlocks( _folder, _text ):
# rta = ""
# lines = _text.split('\n');
# for line in lines:
# if line.find('<canvas id=\"custom\" class=\"canvas\"') >= 0:
# shaderFile = re.search("<canvas id=\"custom\" class=\"canvas\" data-fragment-url=\"(.*?)\"", line.rstrip(), re.S).group(1)
# shaderName, shaderExt = os.path.splitext(shaderFile)
# shaderPath = folder+"/"+shaderFile;
# shaderString = open(shaderPath, 'r').read()
# shaderImage = folder+"/"+shaderName+".png"
# shaderCommand = "glslViewer " + shaderPath + " " + \
# " -s 0.5 -o " + shaderImage
# print shaderCommand
# returnCode = subprocess.call(shaderCommand, shell=True)
# elif line.find('<div class=\"codeAndCanvas\"') >= 0:
# shaderTextureResults = re.findall(r'<div class=\"codeAndCanvas\" data=\".*\" data-imgs=\"(.*)\"></div>', line.rstrip())
# shaderFile = re.sub(r'<div class=\"codeAndCanvas\" data=\"(.*?)\"(>| .+>)</div>', r'\1', line.rstrip())
# shaderName,shaderExt = os.path.splitext(shaderFile)
# shaderPath = folder+"/"+shaderFile;
# if shaderTextureResults:
# shaderTexturePaths = map (lambda f: folder+"/"+f, shaderTextureResults[0].split(","))
# else:
# shaderTexturePaths = []
# shaderString = open(shaderPath, 'r').read()
# shaderImage = folder+"/"+shaderName+".png"
# shaderCommand = "glslViewer " + shaderPath + " " + \
# " ".join(shaderTexturePaths) + \
# " -s 0.5 -o " + shaderImage
# print shaderCommand
# returnCode = subprocess.call(shaderCommand, shell=True)
d='..'
folders = [os.path.join(d,o) for o in os.listdir(d) if os.path.isdir(os.path.join(d,o))];
folders.sort()
for folder in folders:
if os.path.isfile(folder+'/README.md'):
with open(folder+'/README.md', "r") as originalChapter:
fileString = originalChapter.read()
# Correct path for images
imgPattern = r'(\!\[.*?\]\()(.*)'
subPattern = r'\1' + folder + r'/\2'
modifiedChapterString = re.sub(imgPattern, subPattern, fileString)
modifiedChapterString = injectShaderBlocks(folder, modifiedChapterString)
for filename in glob.glob(folder+'/*.frag'):
# print filename
shaderPath = filename;
shaderName,shaderExt = os.path.splitext(filename)
shaderImage = shaderName+".png"
shaderCommand = "glslViewer " + shaderPath + " " + \
" -s 0.5 -o " + shaderImage
print shaderCommand
# returnCode = subprocess.call(shaderCommand, shell=True)

Loading…
Cancel
Save