MyouProject/pixie
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #133 from guzba/master

Browse source 
docs stuff
This commit is contained in:
treeform 2021-02-25 10:10:17 -08:00 committed by GitHub
commit 8140326a2a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
29 changed files with 1611 additions and 1576 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
README.md
View file

@ -168,6 +168,19 @@ image.draw(lines)
### Gradient
[examples/gradient.nim](examples/gradient.nim)
```nim
let paint = Paint(
kind: pkGradientRadial,
gradientHandlePositions: @[
vec2(100, 100),
vec2(200, 100),
vec2(100, 200)
],
gradientStops: @[
ColorStop(color: rgba(255, 0, 0, 255).color, position: 0),
ColorStop(color: rgba(255, 0, 0, 40).color, position: 1.0),
]
)
image.fillPath(
"""
M 20 60
@ -177,18 +190,7 @@ image.fillPath(
Q 20 120 20 60
z
""",
Paint(
kind:pkGradientRadial,
gradientHandlePositions: @[
vec2(100, 100),
vec2(200, 100),
vec2(100, 200)
],
gradientStops: @[
ColorStop(color:rgba(255, 0, 0, 255).color, position: 0),
ColorStop(color:rgba(255, 0, 0, 40).color, position: 1.0),
]
)
paint
)
```
![example output](examples/gradient.png)
@ -205,9 +207,9 @@ path.polygon(
image.fillPath(
path,
Paint(
kind:pkImageTiled,
kind: pkImageTiled,
image: readImage("tests/images/png/baboon.png"),
imageMat:scale(vec2(0.08, 0.08))
imageMat: scale(vec2(0.08, 0.08))
)
)
```

2479
docs/dochack.js
View file

File diff suppressed because it is too large Load diff

34
docs/nimdoc.out.css
View file

@ -14,9 +14,6 @@ Modified by Boyd Greenfield and narimiran
--primary-background: #fff;
--secondary-background: ghostwhite;
--third-background: #e8e8e8;
--info-background: #50c050;
--warning-background: #c0a000;
--error-background: #e04040;
--border: #dde;
--text: #222;
--anchor: #07b;
@ -42,9 +39,6 @@ Modified by Boyd Greenfield and narimiran
--primary-background: #171921;
--secondary-background: #1e202a;
--third-background: #2b2e3b;
--info-background: #008000;
--warning-background: #807000;
--error-background: #c03000;
--border: #0e1014;
--text: #fff;
--anchor: #8be9fd;
@ -615,34 +609,6 @@ table.borderless td, table.borderless th {
The right padding separates the table cells. */
padding: 0 0.5em 0 0 !important; }
.admonition {
padding: 0.3em;
background-color: var(--secondary-background);
border-left: 0.4em solid #7f7f84;
margin-bottom: 0.5em;
-webkit-box-shadow: 0 5px 8px -6px rgba(0,0,0,.2);
-moz-box-shadow: 0 5px 8px -6px rgba(0,0,0,.2);
box-shadow: 0 5px 8px -6px rgba(0,0,0,.2);
}
.admonition-info {
border-color: var(--info-background);
}
.admonition-info-text {
color: var(--info-background);
}
.admonition-warning {
border-color: var(--warning-background);
}
.admonition-warning-text {
color: var(--warning-background);
}
.admonition-error {
border-color: var(--error-background);
}
.admonition-error-text {
color: var(--error-background);
}
.first {
/* Override more specific margin styles with "! important". */
margin-top: 0 !important; }

87
docs/pixie.html
View file

File diff suppressed because one or more lines are too long

7
docs/pixie/blends.html
View file

@ -56,12 +56,10 @@ function main() {
}
}
}
window.addEventListener('DOMContentLoaded', main);
</script>
</head>
<body>
<body onload="main()">
<div class="document" id="documentId">
<div class="container">
<h1 class="title">pixie/blends</h1>
@ -176,7 +174,6 @@ window.addEventListener('DOMContentLoaded', main);
</ul>
</div>
<div class="nine columns" id="content">
<div id="tocRoot"></div>
@ -310,7 +307,7 @@ Is there a blend masking function with SIMD support?
<div class="twelve-columns footer">
<span class="nim-sprite"></span>
<br/>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 15:26:20 UTC</small>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 17:48:08 UTC</small>
</div>
</div>
</div>

39
docs/pixie/common.html
View file

@ -56,12 +56,10 @@ function main() {
}
}
}
window.addEventListener('DOMContentLoaded', main);
</script>
</head>
<body>
<body onload="main()">
<div class="document" id="documentId">
<div class="container">
<h1 class="title">pixie/common</h1>
@ -109,8 +107,6 @@ window.addEventListener('DOMContentLoaded', main);
title="lerp(a, b: uint8; t: float32): uint8">lerp,<wbr>uint8,<wbr>uint8,<wbr>float32</a></li>
<li><a class="reference" href="#lerp%2CColorRGBA%2CColorRGBA%2Cfloat32"
title="lerp(a, b: ColorRGBA; t: float32): ColorRGBA">lerp,<wbr>ColorRGBA,<wbr>ColorRGBA,<wbr>float32</a></li>
<li><a class="reference" href="#lerp%2CColor%2CColor%2Cfloat32"
title="lerp(a, b: Color; v: float32): Color">lerp,<wbr>Color,<wbr>Color,<wbr>float32</a></li>
</ul>
<ul class="simple nested-toc-section">toPremultipliedAlpha
@ -135,11 +131,21 @@ window.addEventListener('DOMContentLoaded', main);
</ul>
</li>
<li>
<a class="reference reference-toplevel" href="#13" id="63">Funcs</a>
<ul class="simple simple-toc-section">
<ul class="simple nested-toc-section">lerp
<li><a class="reference" href="#lerp%2CColor%2CColor%2Cfloat32"
title="lerp(a, b: Color; v: float32): Color">lerp,<wbr>Color,<wbr>Color,<wbr>float32</a></li>
</ul>
</ul>
</li>
</ul>
</div>
<div class="nine columns" id="content">
<div id="tocRoot"></div>
@ -181,13 +187,6 @@ Linearly interpolate between a and b using t.
Linearly interpolate between a and b using t.
</dd>
<a id="lerp,Color,Color,float32"></a>
<dt><pre><span class="Keyword">func</span> <a href="#lerp%2CColor%2CColor%2Cfloat32"><span class="Identifier">lerp</span></a><span class="Other">(</span><span class="Identifier">a</span><span class="Other">,</span> <span class="Identifier">b</span><span class="Other">:</span> <span class="Identifier">Color</span><span class="Other">;</span> <span class="Identifier">v</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">)</span><span class="Other">:</span> <span class="Identifier">Color</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">inline</span><span class="Other">,</span> <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Linearly interpolate between a and b using t.
</dd>
<a id="toPremultipliedAlpha,ColorRGBA"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#toPremultipliedAlpha%2CColorRGBA"><span class="Identifier">toPremultipliedAlpha</span></a><span class="Other">(</span><span class="Identifier">c</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span><span class="Other">)</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">inline</span><span class="Other">,</span> <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span>
@ -219,6 +218,18 @@ Converts a color from premultiplied alpha to straight alpha.
</dd>
</dl></div>
<div class="section" id="13">
<h1><a class="toc-backref" href="#13">Funcs</a></h1>
<dl class="item">
<a id="lerp,Color,Color,float32"></a>
<dt><pre><span class="Keyword">func</span> <a href="#lerp%2CColor%2CColor%2Cfloat32"><span class="Identifier">lerp</span></a><span class="Other">(</span><span class="Identifier">a</span><span class="Other">,</span> <span class="Identifier">b</span><span class="Other">:</span> <span class="Identifier">Color</span><span class="Other">;</span> <span class="Identifier">v</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">)</span><span class="Other">:</span> <span class="Identifier">Color</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">inline</span><span class="Other">,</span> <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Linearly interpolate between a and b using t.
</dd>
</dl></div>
</div>
@ -228,7 +239,7 @@ Converts a color from premultiplied alpha to straight alpha.
<div class="twelve-columns footer">
<span class="nim-sprite"></span>
<br/>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 15:26:20 UTC</small>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 17:48:08 UTC</small>
</div>
</div>
</div>

7
docs/pixie/fileformats/bmp.html
View file

@ -56,12 +56,10 @@ function main() {
}
}
}
window.addEventListener('DOMContentLoaded', main);
</script>
</head>
<body>
<body onload="main()">
<div class="document" id="documentId">
<div class="container">
<h1 class="title">pixie/fileformats/bmp</h1>
@ -129,7 +127,6 @@ window.addEventListener('DOMContentLoaded', main);
</ul>
</div>
<div class="nine columns" id="content">
<div id="tocRoot"></div>
@ -185,7 +182,7 @@ Encodes an image into the BMP file format.
<div class="twelve-columns footer">
<span class="nim-sprite"></span>
<br/>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 15:26:21 UTC</small>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 17:48:08 UTC</small>
</div>
</div>
</div>

7
docs/pixie/fileformats/jpg.html
View file

@ -56,12 +56,10 @@ function main() {
}
}
}
window.addEventListener('DOMContentLoaded', main);
</script>
</head>
<body>
<body onload="main()">
<div class="document" id="documentId">
<div class="container">
<h1 class="title">pixie/fileformats/jpg</h1>
@ -129,7 +127,6 @@ window.addEventListener('DOMContentLoaded', main);
</ul>
</div>
<div class="nine columns" id="content">
<div id="tocRoot"></div>
@ -185,7 +182,7 @@ Encodes Image into a JPEG data string.
<div class="twelve-columns footer">
<span class="nim-sprite"></span>
<br/>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 15:26:21 UTC</small>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 17:48:08 UTC</small>
</div>
</div>
</div>

7
docs/pixie/fileformats/png.html
View file

@ -56,12 +56,10 @@ function main() {
}
}
}
window.addEventListener('DOMContentLoaded', main);
</script>
</head>
<body>
<body onload="main()">
<div class="document" id="documentId">
<div class="container">
<h1 class="title">pixie/fileformats/png</h1>
@ -133,7 +131,6 @@ window.addEventListener('DOMContentLoaded', main);
</ul>
</div>
<div class="nine columns" id="content">
<div id="tocRoot"></div>
@ -204,7 +201,7 @@ Encodes the mask data into the PNG file format.
<div class="twelve-columns footer">
<span class="nim-sprite"></span>
<br/>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 15:26:21 UTC</small>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 17:48:08 UTC</small>
</div>
</div>
</div>

11
docs/pixie/fileformats/svg.html
View file

@ -56,12 +56,10 @@ function main() {
}
}
}
window.addEventListener('DOMContentLoaded', main);
</script>
</head>
<body>
<body onload="main()">
<div class="document" id="documentId">
<div class="container">
<h1 class="title">pixie/fileformats/svg</h1>
@ -124,7 +122,6 @@ window.addEventListener('DOMContentLoaded', main);
</ul>
</div>
<div class="nine columns" id="content">
<div id="tocRoot"></div>
@ -158,10 +155,10 @@ window.addEventListener('DOMContentLoaded', main);
<dl class="item">
<a id="decodeSvg,string,int,int"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#decodeSvg%2Cstring%2Cint%2Cint"><span class="Identifier">decodeSvg</span></a><span class="Other">(</span><span class="Identifier">data</span><span class="Other">:</span> <span class="Identifier">string</span><span class="Other">;</span> <span class="Identifier">width</span> <span class="Other">=</span> <span class="DecNumber">0</span><span class="Other">;</span> <span class="Identifier">height</span> <span class="Other">=</span> <span class="DecNumber">0</span><span class="Other">)</span><span class="Other">:</span> <a href="../images.html#Image"><span class="Identifier">Image</span></a> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
<span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">WriteIOEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">ReadIOEffect</span><span class="Other">,</span> <span class="Identifier">RootEffect</span><span class="Other">,</span> <span class="Identifier">WriteIOEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Render SVG file and return the image.
Render SVG file and return the image. Defaults to the SVG's view box size.
</dd>
@ -174,7 +171,7 @@ Render SVG file and return the image.
<div class="twelve-columns footer">
<span class="nim-sprite"></span>
<br/>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 15:26:22 UTC</small>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 17:48:09 UTC</small>
</div>
</div>
</div>

66
docs/pixie/images.html
View file

@ -56,12 +56,10 @@ function main() {
}
}
}
window.addEventListener('DOMContentLoaded', main);
</script>
</head>
<body>
<body onload="main()">
<div class="document" id="documentId">
<div class="container">
<h1 class="title">pixie/images</h1>
@ -155,11 +153,6 @@ window.addEventListener('DOMContentLoaded', main);
<li><a class="reference" href="#shift%2C%2CVec2"
title="shift(target: Image | Mask; offset: Vec2)">shift,<wbr>,<wbr>Vec2</a></li>
</ul>
<ul class="simple nested-toc-section">getRgbaSmoothWrapped
<li><a class="reference" href="#getRgbaSmoothWrapped%2CImage%2Cfloat32%2Cfloat32"
title="getRgbaSmoothWrapped(image: Image; x, y: float32): ColorRGBA">getRgbaSmoothWrapped,<wbr>Image,<wbr>float32,<wbr>float32</a></li>
</ul>
<ul class="simple nested-toc-section">[]=
<li><a class="reference" href="#%5B%5D%3D%2CImage%2Cint%2Cint%2CColorRGBA"
@ -205,6 +198,11 @@ window.addEventListener('DOMContentLoaded', main);
<li><a class="reference" href="#magnifyBy2%2CImage%2Cint"
title="magnifyBy2(image: Image; power = 1): Image">magnifyBy2,<wbr>Image,<wbr>int</a></li>
</ul>
<ul class="simple nested-toc-section">shadow
<li><a class="reference" href="#shadow%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CColorRGBA"
title="shadow(image: Image; offset: Vec2; spread, blur: float32; color: ColorRGBA): Image">shadow,<wbr>Image,<wbr>Vec2,<wbr>float32,<wbr>float32,<wbr>ColorRGBA</a></li>
</ul>
<ul class="simple nested-toc-section">newMask
<li><a class="reference" href="#newMask%2CImage"
@ -225,6 +223,11 @@ window.addEventListener('DOMContentLoaded', main);
<li><a class="reference" href="#minifyBy2%2CImage%2Cint"
title="minifyBy2(image: Image; power = 1): Image">minifyBy2,<wbr>Image,<wbr>int</a></li>
</ul>
<ul class="simple nested-toc-section">drawTiled
<li><a class="reference" href="#drawTiled%2CImage%2CImage%2CMat3"
title="drawTiled(dest, src: Image; mat: Mat3; blendMode = bmNormal)">drawTiled,<wbr>Image,<wbr>Image,<wbr>Mat3</a></li>
</ul>
<ul class="simple nested-toc-section">subImage
<li><a class="reference" href="#subImage%2CImage%2Cint%2Cint%2Cint%2Cint"
@ -235,6 +238,11 @@ window.addEventListener('DOMContentLoaded', main);
<li><a class="reference" href="#blur%2C%2Cfloat32%2Cuint32"
title="blur(target: Image | Mask; radius: float32; offBounds: uint32 = 0)">blur,<wbr>,<wbr>float32,<wbr>uint32</a></li>
</ul>
<ul class="simple nested-toc-section">toStraightAlpha
<li><a class="reference" href="#toStraightAlpha%2CImage"
title="toStraightAlpha(image: Image)">toStraightAlpha,<wbr>Image</a></li>
</ul>
<ul class="simple nested-toc-section">dataIndex
<li><a class="reference" href="#dataIndex%2CImage%2Cint%2Cint"
@ -243,7 +251,7 @@ window.addEventListener('DOMContentLoaded', main);
</ul>
<ul class="simple nested-toc-section">getRgbaSmooth
<li><a class="reference" href="#getRgbaSmooth%2CImage%2Cfloat32%2Cfloat32"
title="getRgbaSmooth(image: Image; x, y: float32): ColorRGBA">getRgbaSmooth,<wbr>Image,<wbr>float32,<wbr>float32</a></li>
title="getRgbaSmooth(image: Image; x, y: float32; wrapped = false): ColorRGBA">getRgbaSmooth,<wbr>Image,<wbr>float32,<wbr>float32</a></li>
</ul>
<ul class="simple nested-toc-section">inside
@ -273,7 +281,6 @@ window.addEventListener('DOMContentLoaded', main);
</ul>
</div>
<div class="nine columns" id="content">
<div id="tocRoot"></div>
@ -436,7 +443,7 @@ Scales the image down by an integer scale.
<dt><pre><span class="Keyword">proc</span> <a href="#magnifyBy2%2CImage%2Cint"><span class="Identifier">magnifyBy2</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">power</span> <span class="Other">=</span> <span class="DecNumber">1</span><span class="Other">)</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Scales image image up by 2 ^ power.
Scales image up by 2 ^ power.
</dd>
<a id="toPremultipliedAlpha,Image"></a>
@ -445,6 +452,13 @@ Scales image image up by 2 ^ power.
Converts an image to premultiplied alpha from straight alpha.
</dd>
<a id="toStraightAlpha,Image"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#toStraightAlpha%2CImage"><span class="Identifier">toStraightAlpha</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Converts an image from premultiplied alpha to straight alpha. This is expensive for large images.
</dd>
<a id="applyOpacity,,float32"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#applyOpacity%2C%2Cfloat32"><span class="Identifier">applyOpacity</span></a><span class="Other">(</span><span class="Identifier">target</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a> <span class="Operator">|</span> <a href="masks.html#Mask"><span class="Identifier">Mask</span></a><span class="Other">;</span> <span class="Identifier">opacity</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">)</span></pre></dt>
@ -475,20 +489,12 @@ Returns a new mask using the alpha values of the parameter image.
</dd>
<a id="getRgbaSmooth,Image,float32,float32"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#getRgbaSmooth%2CImage%2Cfloat32%2Cfloat32"><span class="Identifier">getRgbaSmooth</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">x</span><span class="Other">,</span> <span class="Identifier">y</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">)</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span>
<span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dt><pre><span class="Keyword">proc</span> <a href="#getRgbaSmooth%2CImage%2Cfloat32%2Cfloat32"><span class="Identifier">getRgbaSmooth</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">x</span><span class="Other">,</span> <span class="Identifier">y</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">wrapped</span> <span class="Other">=</span> <span class="Identifier">false</span><span class="Other">)</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
<span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Gets a interpolated color with float point coordinates. Pixes outside the image are transparent.
</dd>
<a id="getRgbaSmoothWrapped,Image,float32,float32"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#getRgbaSmoothWrapped%2CImage%2Cfloat32%2Cfloat32"><span class="Identifier">getRgbaSmoothWrapped</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">x</span><span class="Other">,</span> <span class="Identifier">y</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">)</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span>
<span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Gets a interpolated color with float point coordinates. Pixes outside the image are repeated.
</dd>
<a id="draw,Image,Image,Mat3"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#draw%2CImage%2CImage%2CMat3"><span class="Identifier">draw</span></a><span class="Other">(</span><span class="Identifier">a</span><span class="Other">,</span> <span class="Identifier">b</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">mat</span><span class="Other">:</span> <span class="Identifier">Mat3</span><span class="Other">;</span> <span class="Identifier">blendMode</span> <span class="Other">=</span> <span class="Identifier">bmNormal</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">inline</span><span class="Other">,</span>
@ -553,6 +559,14 @@ Draws a image onto a mask using a matrix with color blending.
Draws a image onto a mask using a position offset with color blending.
</dd>
<a id="drawTiled,Image,Image,Mat3"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#drawTiled%2CImage%2CImage%2CMat3"><span class="Identifier">drawTiled</span></a><span class="Other">(</span><span class="Identifier">dest</span><span class="Other">,</span> <span class="Identifier">src</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">mat</span><span class="Other">:</span> <span class="Identifier">Mat3</span><span class="Other">;</span> <span class="Identifier">blendMode</span> <span class="Other">=</span> <span class="Identifier">bmNormal</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
<span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">,</span> <span class="Identifier">Exception</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">RootEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
</dd>
<a id="resize,Image,int,int"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#resize%2CImage%2Cint%2Cint"><span class="Identifier">resize</span></a><span class="Other">(</span><span class="Identifier">srcImage</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">width</span><span class="Other">,</span> <span class="Identifier">height</span><span class="Other">:</span> <span class="Identifier">int</span><span class="Other">)</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
@ -568,6 +582,14 @@ Resize an image to a given hight and width.
Shifts the target by offset.
</dd>
<a id="shadow,Image,Vec2,float32,float32,ColorRGBA"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#shadow%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CColorRGBA"><span class="Identifier">shadow</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">offset</span><span class="Other">:</span> <span class="Identifier">Vec2</span><span class="Other">;</span> <span class="Identifier">spread</span><span class="Other">,</span> <span class="Identifier">blur</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span><span class="Other">)</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
<span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">,</span> <span class="Identifier">Exception</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">RootEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Create a shadow of the image with the offset, spread and blur.
</dd>
</dl></div>
@ -579,7 +601,7 @@ Shifts the target by offset.
<div class="twelve-columns footer">
<span class="nim-sprite"></span>
<br/>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 15:26:21 UTC</small>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 17:48:08 UTC</small>
</div>
</div>
</div>

6
docs/pixie/images.idx
View file

@ -18,12 +18,12 @@ superImage pixie/images.html#superImage,Image,int,int,int,int images: superImage
minifyBy2 pixie/images.html#minifyBy2,Image,int images: minifyBy2(image: Image; power = 1): Image
magnifyBy2 pixie/images.html#magnifyBy2,Image,int images: magnifyBy2(image: Image; power = 1): Image
toPremultipliedAlpha pixie/images.html#toPremultipliedAlpha,Image images: toPremultipliedAlpha(image: Image)
toStraightAlpha pixie/images.html#toStraightAlpha,Image images: toStraightAlpha(image: Image)
applyOpacity pixie/images.html#applyOpacity,,float32 images: applyOpacity(target: Image | Mask; opacity: float32)
invert pixie/images.html#invert images: invert(target: Image | Mask)
blur pixie/images.html#blur,,float32,uint32 images: blur(target: Image | Mask; radius: float32; offBounds: uint32 = 0)
newMask pixie/images.html#newMask,Image images: newMask(image: Image): Mask
getRgbaSmooth pixie/images.html#getRgbaSmooth,Image,float32,float32 images: getRgbaSmooth(image: Image; x, y: float32): ColorRGBA
getRgbaSmoothWrapped pixie/images.html#getRgbaSmoothWrapped,Image,float32,float32 images: getRgbaSmoothWrapped(image: Image; x, y: float32): ColorRGBA
getRgbaSmooth pixie/images.html#getRgbaSmooth,Image,float32,float32 images: getRgbaSmooth(image: Image; x, y: float32; wrapped = false): ColorRGBA
draw pixie/images.html#draw,Image,Image,Mat3 images: draw(a, b: Image; mat: Mat3; blendMode = bmNormal)
draw pixie/images.html#draw,Image,Image images: draw(a, b: Image; pos = vec2(0, 0); blendMode = bmNormal)
draw pixie/images.html#draw,Image,Mask,Mat3 images: draw(image: Image; mask: Mask; mat: Mat3; blendMode = bmMask)
@ -32,5 +32,7 @@ draw pixie/images.html#draw,Mask,Mask,Mat3 images: draw(a, b: Mask; mat: Mat3; b
draw pixie/images.html#draw,Mask,Mask images: draw(a, b: Mask; pos = vec2(0, 0); blendMode = bmMask)
draw pixie/images.html#draw,Mask,Image,Mat3 images: draw(mask: Mask; image: Image; mat: Mat3; blendMode = bmMask)
draw pixie/images.html#draw,Mask,Image images: draw(mask: Mask; image: Image; pos = vec2(0, 0); blendMode = bmMask)
drawTiled pixie/images.html#drawTiled,Image,Image,Mat3 images: drawTiled(dest, src: Image; mat: Mat3; blendMode = bmNormal)
resize pixie/images.html#resize,Image,int,int images: resize(srcImage: Image; width, height: int): Image
shift pixie/images.html#shift,,Vec2 images: shift(target: Image | Mask; offset: Vec2)
shadow pixie/images.html#shadow,Image,Vec2,float32,float32,ColorRGBA images: shadow(image: Image; offset: Vec2; spread, blur: float32; color: ColorRGBA): Image

7
docs/pixie/masks.html
View file

@ -56,12 +56,10 @@ function main() {
}
}
}
window.addEventListener('DOMContentLoaded', main);
</script>
</head>
<body>
<body onload="main()">
<div class="document" id="documentId">
<div class="container">
<h1 class="title">pixie/masks</h1>
@ -199,7 +197,6 @@ window.addEventListener('DOMContentLoaded', main);
</ul>
</div>
<div class="nine columns" id="content">
<div id="tocRoot"></div>
@ -357,7 +354,7 @@ A value of 0 stays 0. Anything else turns into 255.
<div class="twelve-columns footer">
<span class="nim-sprite"></span>
<br/>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 15:26:20 UTC</small>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 17:48:08 UTC</small>
</div>
</div>
</div>

37
docs/pixie/paints.html
View file

@ -56,12 +56,10 @@ function main() {
}
}
}
window.addEventListener('DOMContentLoaded', main);
</script>
</head>
<body>
<body onload="main()">
<div class="document" id="documentId">
<div class="container">
<h1 class="title">pixie/paints</h1>
@ -131,12 +129,7 @@ window.addEventListener('DOMContentLoaded', main);
<li>
<a class="reference reference-toplevel" href="#12" id="62">Procs</a>
<ul class="simple simple-toc-section">
<ul class="simple nested-toc-section">fillImage
<li><a class="reference" href="#fillImage%2CImage%2CImage%2CMat3"
title="fillImage(dest: Image; src: Image; mat: Mat3)">fillImage,<wbr>Image,<wbr>Image,<wbr>Mat3</a></li>
</ul>
<ul class="simple nested-toc-section">fillAngularGradient
<ul class="simple nested-toc-section">fillAngularGradient
<li><a class="reference" href="#fillAngularGradient%2CImage%2CVec2%2CVec2%2CVec2%2Cseq%5BColorStop%5D"
title="fillAngularGradient(image: Image; center, edge, skew: Vec2;
stops: seq[ColorStop])">fillAngularGradient,<wbr>Image,<wbr>Vec2,<wbr>Vec2,<wbr>Vec2,<wbr>seq[ColorStop]</a></li>
@ -151,11 +144,6 @@ window.addEventListener('DOMContentLoaded', main);
<li><a class="reference" href="#fillRadialGradient%2CImage%2CVec2%2CVec2%2CVec2%2Cseq%5BColorStop%5D"
title="fillRadialGradient(image: Image; center, edge, skew: Vec2; stops: seq[ColorStop])">fillRadialGradient,<wbr>Image,<wbr>Vec2,<wbr>Vec2,<wbr>Vec2,<wbr>seq[ColorStop]</a></li>
</ul>
<ul class="simple nested-toc-section">fillImageTiled
<li><a class="reference" href="#fillImageTiled%2CImage%2CImage%2CMat3"
title="fillImageTiled(dest: Image; src: Image; mat: Mat3)">fillImageTiled,<wbr>Image,<wbr>Image,<wbr>Mat3</a></li>
</ul>
</ul>
@ -164,7 +152,6 @@ window.addEventListener('DOMContentLoaded', main);
</ul>
</div>
<div class="nine columns" id="content">
<div id="tocRoot"></div>
@ -172,7 +159,7 @@ window.addEventListener('DOMContentLoaded', main);
<div class="section" id="6">
<h1><a class="toc-backref" href="#6">Imports</a></h1>
<dl class="item">
<a class="reference external" href="common.html">common</a>, <a class="reference external" href="images.html">images</a>, <a class="reference external" href="blends.html">blends</a>
<a class="reference external" href="blends.html">blends</a>, <a class="reference external" href="common.html">common</a>, <a class="reference external" href="images.html">images</a>
</dl></div>
<div class="section" id="7">
<h1><a class="toc-backref" href="#7">Types</a></h1>
@ -222,22 +209,6 @@ Color stop on a gradient curve.
<div class="section" id="12">
<h1><a class="toc-backref" href="#12">Procs</a></h1>
<dl class="item">
<a id="fillImage,Image,Image,Mat3"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#fillImage%2CImage%2CImage%2CMat3"><span class="Identifier">fillImage</span></a><span class="Other">(</span><span class="Identifier">dest</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">src</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">mat</span><span class="Other">:</span> <span class="Identifier">Mat3</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
<span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">,</span> <span class="Identifier">Exception</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">RootEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Draws and basic image fill.
</dd>
<a id="fillImageTiled,Image,Image,Mat3"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#fillImageTiled%2CImage%2CImage%2CMat3"><span class="Identifier">fillImageTiled</span></a><span class="Other">(</span><span class="Identifier">dest</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">src</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">mat</span><span class="Other">:</span> <span class="Identifier">Mat3</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">]</span><span class="Other">,</span>
<span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Draws a tiled image fill.
</dd>
<a id="fillLinearGradient,Image,Vec2,Vec2,seq[ColorStop]"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#fillLinearGradient%2CImage%2CVec2%2CVec2%2Cseq%5BColorStop%5D"><span class="Identifier">fillLinearGradient</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">at</span><span class="Other">,</span> <span class="Identifier">to</span><span class="Other">:</span> <span class="Identifier">Vec2</span><span class="Other">;</span> <span class="Identifier">stops</span><span class="Other">:</span> <span class="Identifier">seq</span><span class="Other">[</span><a href="paints.html#ColorStop"><span class="Identifier">ColorStop</span></a><span class="Other">]</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
<span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
@ -272,7 +243,7 @@ Angular gradient.
<div class="twelve-columns footer">
<span class="nim-sprite"></span>
<br/>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 15:26:21 UTC</small>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 17:48:09 UTC</small>
</div>
</div>
</div>

2
docs/pixie/paints.idx
View file

@ -7,8 +7,6 @@ pkGradientAngular pixie/paints.html#pkGradientAngular PaintKind.pkGradientAngula
PaintKind pixie/paints.html#PaintKind paints: PaintKind
Paint pixie/paints.html#Paint paints: Paint
ColorStop pixie/paints.html#ColorStop paints: ColorStop
fillImage pixie/paints.html#fillImage,Image,Image,Mat3 paints: fillImage(dest: Image; src: Image; mat: Mat3)
fillImageTiled pixie/paints.html#fillImageTiled,Image,Image,Mat3 paints: fillImageTiled(dest: Image; src: Image; mat: Mat3)
fillLinearGradient pixie/paints.html#fillLinearGradient,Image,Vec2,Vec2,seq[ColorStop] paints: fillLinearGradient(image: Image; at, to: Vec2; stops: seq[ColorStop])
fillRadialGradient pixie/paints.html#fillRadialGradient,Image,Vec2,Vec2,Vec2,seq[ColorStop] paints: fillRadialGradient(image: Image; center, edge, skew: Vec2; stops: seq[ColorStop])
fillAngularGradient pixie/paints.html#fillAngularGradient,Image,Vec2,Vec2,Vec2,seq[ColorStop] paints: fillAngularGradient(image: Image; center, edge, skew: Vec2;\n stops: seq[ColorStop])

68
docs/pixie/paths.html
View file

@ -56,12 +56,10 @@ function main() {
}
}
}
window.addEventListener('DOMContentLoaded', main);
</script>
</head>
<body>
<body onload="main()">
<div class="document" id="documentId">
<div class="container">
<h1 class="title">pixie/paths</h1>
@ -137,11 +135,21 @@ window.addEventListener('DOMContentLoaded', main);
<li><a class="reference" href="#bezierCurveTo%2CPath%2CVec2%2CVec2%2CVec2"
title="bezierCurveTo(path: var Path; ctrl1, ctrl2, to: Vec2)">bezierCurveTo,<wbr>Path,<wbr>Vec2,<wbr>Vec2,<wbr>Vec2</a></li>
</ul>
<ul class="simple nested-toc-section">transform
<li><a class="reference" href="#transform%2CPath%2CMat3"
title="transform(path: var Path; mat: Mat3)">transform,<wbr>Path,<wbr>Mat3</a></li>
</ul>
<ul class="simple nested-toc-section">addPath
<li><a class="reference" href="#addPath%2CPath%2CPath"
title="addPath(path: var Path; other: Path)">addPath,<wbr>Path,<wbr>Path</a></li>
</ul>
<ul class="simple nested-toc-section">$
<li><a class="reference" href="#%24%2CPath"
title="`$`(path: Path): string">$,<wbr>Path</a></li>
</ul>
<ul class="simple nested-toc-section">strokePath
<li><a class="reference" href="#strokePath%2CImage%2CSomePath%2CColorRGBA%2Cfloat"
@ -214,6 +222,11 @@ window.addEventListener('DOMContentLoaded', main);
<li><a class="reference" href="#arcTo%2CPath%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32"
title="arcTo(path: var Path; x1, y1, x2, y2, radius: float32)">arcTo,<wbr>Path,<wbr>float32,<wbr>float32,<wbr>float32,<wbr>float32,<wbr>float32</a></li>
</ul>
<ul class="simple nested-toc-section">commandsToShapes
<li><a class="reference" href="#commandsToShapes%2CPath%2Cfloat32"
title="commandsToShapes(path: Path; pixelScale: float32 = 1.0): seq[seq[Vec2]]">commandsToShapes,<wbr>Path,<wbr>float32</a></li>
</ul>
<ul class="simple nested-toc-section">rect
<li><a class="reference" href="#rect%2CPath%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32"
@ -269,7 +282,6 @@ window.addEventListener('DOMContentLoaded', main);
</ul>
</div>
<div class="nine columns" id="content">
<div id="tocRoot"></div>
@ -347,11 +359,25 @@ Used to hold paths and create paths.
<div class="section" id="12">
<h1><a class="toc-backref" href="#12">Procs</a></h1>
<dl class="item">
<a id="$,Path"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#%24%2CPath"><span class="Identifier">`$`</span></a><span class="Other">(</span><span class="Identifier">path</span><span class="Other">:</span> <a href="paths.html#Path"><span class="Identifier">Path</span></a><span class="Other">)</span><span class="Other">:</span> <span class="Identifier">string</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Turn path int into a string.
</dd>
<a id="parsePath,string"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#parsePath%2Cstring"><span class="Identifier">parsePath</span></a><span class="Other">(</span><span class="Identifier">path</span><span class="Other">:</span> <span class="Identifier">string</span><span class="Other">)</span><span class="Other">:</span> <a href="paths.html#Path"><span class="Identifier">Path</span></a> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Converts a SVG style path into seq of commands.
Converts a SVG style path string into seq of commands.
</dd>
<a id="transform,Path,Mat3"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#transform%2CPath%2CMat3"><span class="Identifier">transform</span></a><span class="Other">(</span><span class="Identifier">path</span><span class="Other">:</span> <span class="Keyword">var</span> <a href="paths.html#Path"><span class="Identifier">Path</span></a><span class="Other">;</span> <span class="Identifier">mat</span><span class="Other">:</span> <span class="Identifier">Mat3</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Apply a matrix transform to a path.
</dd>
<a id="addPath,Path,Path"></a>
@ -437,11 +463,11 @@ Adds a circular arc to the current sub-path, using the given control points and
</dd>
<a id="arcTo,Path,float32,float32,float32,float32,float32"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#arcTo%2CPath%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32"><span class="Identifier">arcTo</span></a><span class="Other">(</span><span class="Identifier">path</span><span class="Other">:</span> <span class="Keyword">var</span> <a href="paths.html#Path"><span class="Identifier">Path</span></a><span class="Other">;</span> <span class="Identifier">x1</span><span class="Other">,</span> <span class="Identifier">y1</span><span class="Other">,</span> <span class="Identifier">x2</span><span class="Other">,</span> <span class="Identifier">y2</span><span class="Other">,</span> <span class="Identifier">radius</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span>
<span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dt><pre><span class="Keyword">proc</span> <a href="#arcTo%2CPath%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32"><span class="Identifier">arcTo</span></a><span class="Other">(</span><span class="Identifier">path</span><span class="Other">:</span> <span class="Keyword">var</span> <a href="paths.html#Path"><span class="Identifier">Path</span></a><span class="Other">;</span> <span class="Identifier">x1</span><span class="Other">,</span> <span class="Identifier">y1</span><span class="Other">,</span> <span class="Identifier">x2</span><span class="Other">,</span> <span class="Identifier">y2</span><span class="Other">,</span> <span class="Identifier">radius</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">inline</span><span class="Other">,</span>
<span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Adds a circular arc to the current sub-path, using the given control points and radius.
</dd>
<a id="ellipticalArcTo,Path,float32,float32,float32,bool,bool,float32,float32"></a>
@ -458,7 +484,7 @@ Adds an elliptical arc to the current sub-path, using the given radius ratios, s
<span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Adds a rectangle. Clockwise param can be used to subtract a rect from a path when using even-odd winding rule.
</dd>
<a id="rect,Path,Vec2,Vec2"></a>
@ -466,7 +492,7 @@ Adds an elliptical arc to the current sub-path, using the given radius ratios, s
<span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Adds a rectangle. Clockwise param can be used to subtract a rect from a path using even-odd.
Adds a rectangle. Clockwise param can be used to subtract a rect from a path when using even-odd winding rule.
</dd>
<a id="rect,Path,Rect"></a>
@ -474,7 +500,7 @@ Adds a rectangle. Clockwise param can be used to subtract a rect from a path usi
<span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Adds a rectangle. Clockwise param can be used to subtract a rect from a path using even-odd.
Adds a rectangle. Clockwise param can be used to subtract a rect from a path when using even-odd winding rule.
</dd>
<a id="roundedRect,Path,float32,float32,float32,float32,float32,float32,float32,float32"></a>
@ -482,7 +508,7 @@ Adds a rectangle. Clockwise param can be used to subtract a rect from a path usi
<span class="Identifier">clockwise</span> <span class="Other">=</span> <span class="Identifier">true</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Adds a rounded rectangle. Clockwise param can be used to subtract a rect from a path using even-odd.
Adds a rounded rectangle. Clockwise param can be used to subtract a rect from a path when using even-odd winding rule.
</dd>
<a id="roundedRect,Path,Vec2,Vec2,float32,float32,float32,float32"></a>
@ -490,7 +516,7 @@ Adds a rounded rectangle. Clockwise param can be used to subtract a rect from a
<span class="Identifier">clockwise</span> <span class="Other">=</span> <span class="Identifier">true</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">inline</span><span class="Other">,</span> <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Adds a rounded rectangle. Clockwise param can be used to subtract a rect from a path using even-odd.
Adds a rounded rectangle. Clockwise param can be used to subtract a rect from a path when using even-odd winding rule.
</dd>
<a id="roundedRect,Path,Rect,float32,float32,float32,float32"></a>
@ -498,7 +524,7 @@ Adds a rounded rectangle. Clockwise param can be used to subtract a rect from a
<span class="Identifier">clockwise</span> <span class="Other">=</span> <span class="Identifier">true</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">inline</span><span class="Other">,</span> <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Adds a rounded rectangle. Clockwise param can be used to subtract a rect from a path using even-odd.
Adds a rounded rectangle. Clockwise param can be used to subtract a rect from a path when using even-odd winding rule.
</dd>
<a id="ellipse,Path,float32,float32,float32,float32"></a>
@ -521,7 +547,7 @@ Adds a ellipse.
<span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Draws a n-sided regular polygon at (x, y) with a size.
Draws an n-sided regular polygon at (x, y) with the parameter size.
</dd>
<a id="polygon,Path,Vec2,float32,int"></a>
@ -529,7 +555,15 @@ Draws a n-sided regular polygon at (x, y) with a size.
<span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Draws a n-sided regular polygon at (x, y) with a size.
Draws a n-sided regular polygon at (x, y) with the parameter size.
</dd>
<a id="commandsToShapes,Path,float32"></a>
<dt><pre><span class="Keyword">proc</span> <a href="#commandsToShapes%2CPath%2Cfloat32"><span class="Identifier">commandsToShapes</span></a><span class="Other">(</span><span class="Identifier">path</span><span class="Other">:</span> <a href="paths.html#Path"><span class="Identifier">Path</span></a><span class="Other">;</span> <span class="Identifier">pixelScale</span><span class="Other">:</span> <span class="Identifier">float32</span> <span class="Other">=</span> <span class="FloatNumber">1.0</span><span class="Other">)</span><span class="Other">:</span> <span class="Identifier">seq</span><span class="Other">[</span><span class="Identifier">seq</span><span class="Other">[</span><span class="Identifier">Vec2</span><span class="Other">]</span><span class="Other">]</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
<span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
<dd>
Converts SVG-like commands to line segments.
</dd>
<a id="fillPath,Image,SomePath,ColorRGBA"></a>
@ -628,7 +662,7 @@ Return elements in pairs: (1st, 2nd), (2nd, 3rd) ... (n - 1, last).
<div class="twelve-columns footer">
<span class="nim-sprite"></span>
<br/>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 15:26:22 UTC</small>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 17:48:09 UTC</small>
</div>
</div>
</div>

3
docs/pixie/paths.idx
View file

@ -32,7 +32,9 @@ PathCommandKind pixie/paths.html#PathCommandKind paths: PathCommandKind
PathCommand pixie/paths.html#PathCommand paths: PathCommand
Path pixie/paths.html#Path paths: Path
SomePath pixie/paths.html#SomePath paths: SomePath
`$` pixie/paths.html#$,Path paths: `$`(path: Path): string
parsePath pixie/paths.html#parsePath,string paths: parsePath(path: string): Path
transform pixie/paths.html#transform,Path,Mat3 paths: transform(path: var Path; mat: Mat3)
addPath pixie/paths.html#addPath,Path,Path paths: addPath(path: var Path; other: Path)
closePath pixie/paths.html#closePath,Path paths: closePath(path: var Path)
moveTo pixie/paths.html#moveTo,Path,float32,float32 paths: moveTo(path: var Path; x, y: float32)
@ -56,6 +58,7 @@ ellipse pixie/paths.html#ellipse,Path,float32,float32,float32,float32 paths: ell
ellipse pixie/paths.html#ellipse,Path,Vec2,float32,float32 paths: ellipse(path: var Path; center: Vec2; rx, ry: float32)
polygon pixie/paths.html#polygon,Path,float32,float32,float32,int paths: polygon(path: var Path; x, y, size: float32; sides: int)
polygon pixie/paths.html#polygon,Path,Vec2,float32,int paths: polygon(path: var Path; pos: Vec2; size: float32; sides: int)
commandsToShapes pixie/paths.html#commandsToShapes,Path,float32 paths: commandsToShapes(path: Path; pixelScale: float32 = 1.0): seq[seq[Vec2]]
segments pixie/paths.html#segments.i,seq[Vec2] paths: segments(s: seq[Vec2]): Segment
fillPath pixie/paths.html#fillPath,Image,SomePath,ColorRGBA paths: fillPath(image: Image; path: SomePath; color: ColorRGBA;\n windingRule = wrNonZero; blendMode = bmNormal)
fillPath pixie/paths.html#fillPath,Image,SomePath,ColorRGBA, paths: fillPath(image: Image; path: SomePath; color: ColorRGBA; transform: Vec2 | Mat3;\n windingRule = wrNonZero; blendMode = bmNormal)

40
docs/theindex.html
View file

@ -56,12 +56,10 @@ function main() {
}
}
}
window.addEventListener('DOMContentLoaded', main);
</script>
</head>
<body>
<body onload="main()">
<div class="document" id="documentId">
<div class="container">
<h1 class="title">Index</h1>
@ -71,6 +69,8 @@ window.addEventListener('DOMContentLoaded', main);
data-doc-search-tag="images: `$`(image: Image): string" href="pixie/images.html#%24%2CImage">images: `$`(image: Image): string</a></li>
<li><a class="reference external"
data-doc-search-tag="masks: `$`(mask: Mask): string" href="pixie/masks.html#%24%2CMask">masks: `$`(mask: Mask): string</a></li>
<li><a class="reference external"
data-doc-search-tag="paths: `$`(path: Path): string" href="pixie/paths.html#%24%2CPath">paths: `$`(path: Path): string</a></li>
</ul></dd>
<dt><a name="%60%5B%5D%3D%60" href="#%60%5B%5D%3D%60"><span>`[]=`:</span></a></dt><dd><ul class="simple">
<li><a class="reference external"
@ -240,6 +240,10 @@ window.addEventListener('DOMContentLoaded', main);
<li><a class="reference external"
data-doc-search-tag="paints: ColorStop" href="pixie/paints.html#ColorStop">paints: ColorStop</a></li>
</ul></dd>
<dt><a name="commandsToShapes" href="#commandsToShapes"><span>commandsToShapes:</span></a></dt><dd><ul class="simple">
<li><a class="reference external"
data-doc-search-tag="paths: commandsToShapes(path: Path; pixelScale: float32 = 1.0): seq[seq[Vec2]]" href="pixie/paths.html#commandsToShapes%2CPath%2Cfloat32">paths: commandsToShapes(path: Path; pixelScale: float32 = 1.0): seq[seq[Vec2]]</a></li>
</ul></dd>
<dt><a name="copy" href="#copy"><span>copy:</span></a></dt><dd><ul class="simple">
<li><a class="reference external"
data-doc-search-tag="images: copy(image: Image): Image" href="pixie/images.html#copy%2CImage">images: copy(image: Image): Image</a></li>
@ -300,6 +304,10 @@ window.addEventListener('DOMContentLoaded', main);
<li><a class="reference external"
data-doc-search-tag="images: draw(a, b: Mask; mat: Mat3; blendMode = bmMask)" href="pixie/images.html#draw%2CMask%2CMask%2CMat3">images: draw(a, b: Mask; mat: Mat3; blendMode = bmMask)</a></li>
</ul></dd>
<dt><a name="drawTiled" href="#drawTiled"><span>drawTiled:</span></a></dt><dd><ul class="simple">
<li><a class="reference external"
data-doc-search-tag="images: drawTiled(dest, src: Image; mat: Mat3; blendMode = bmNormal)" href="pixie/images.html#drawTiled%2CImage%2CImage%2CMat3">images: drawTiled(dest, src: Image; mat: Mat3; blendMode = bmNormal)</a></li>
</ul></dd>
<dt><a name="ellipse" href="#ellipse"><span>ellipse:</span></a></dt><dd><ul class="simple">
<li><a class="reference external"
data-doc-search-tag="paths: ellipse(path: var Path; cx, cy, rx, ry: float32)" href="pixie/paths.html#ellipse%2CPath%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32">paths: ellipse(path: var Path; cx, cy, rx, ry: float32)</a></li>
@ -374,14 +382,6 @@ window.addEventListener('DOMContentLoaded', main);
<li><a class="reference external"
data-doc-search-tag="pixie: fillEllipse(mask: Mask; center: Vec2; rx, ry: float32)" href="pixie.html#fillEllipse%2CMask%2CVec2%2Cfloat32%2Cfloat32">pixie: fillEllipse(mask: Mask; center: Vec2; rx, ry: float32)</a></li>
</ul></dd>
<dt><a name="fillImage" href="#fillImage"><span>fillImage:</span></a></dt><dd><ul class="simple">
<li><a class="reference external"
data-doc-search-tag="paints: fillImage(dest: Image; src: Image; mat: Mat3)" href="pixie/paints.html#fillImage%2CImage%2CImage%2CMat3">paints: fillImage(dest: Image; src: Image; mat: Mat3)</a></li>
</ul></dd>
<dt><a name="fillImageTiled" href="#fillImageTiled"><span>fillImageTiled:</span></a></dt><dd><ul class="simple">
<li><a class="reference external"
data-doc-search-tag="paints: fillImageTiled(dest: Image; src: Image; mat: Mat3)" href="pixie/paints.html#fillImageTiled%2CImage%2CImage%2CMat3">paints: fillImageTiled(dest: Image; src: Image; mat: Mat3)</a></li>
</ul></dd>
<dt><a name="fillLinearGradient" href="#fillLinearGradient"><span>fillLinearGradient:</span></a></dt><dd><ul class="simple">
<li><a class="reference external"
data-doc-search-tag="paints: fillLinearGradient(image: Image; at, to: Vec2; stops: seq[ColorStop])" href="pixie/paints.html#fillLinearGradient%2CImage%2CVec2%2CVec2%2Cseq%5BColorStop%5D">paints: fillLinearGradient(image: Image; at, to: Vec2; stops: seq[ColorStop])</a></li>
@ -452,11 +452,7 @@ window.addEventListener('DOMContentLoaded', main);
</ul></dd>
<dt><a name="getRgbaSmooth" href="#getRgbaSmooth"><span>getRgbaSmooth:</span></a></dt><dd><ul class="simple">
<li><a class="reference external"
data-doc-search-tag="images: getRgbaSmooth(image: Image; x, y: float32): ColorRGBA" href="pixie/images.html#getRgbaSmooth%2CImage%2Cfloat32%2Cfloat32">images: getRgbaSmooth(image: Image; x, y: float32): ColorRGBA</a></li>
</ul></dd>
<dt><a name="getRgbaSmoothWrapped" href="#getRgbaSmoothWrapped"><span>getRgbaSmoothWrapped:</span></a></dt><dd><ul class="simple">
<li><a class="reference external"
data-doc-search-tag="images: getRgbaSmoothWrapped(image: Image; x, y: float32): ColorRGBA" href="pixie/images.html#getRgbaSmoothWrapped%2CImage%2Cfloat32%2Cfloat32">images: getRgbaSmoothWrapped(image: Image; x, y: float32): ColorRGBA</a></li>
data-doc-search-tag="images: getRgbaSmooth(image: Image; x, y: float32; wrapped = false): ColorRGBA" href="pixie/images.html#getRgbaSmooth%2CImage%2Cfloat32%2Cfloat32">images: getRgbaSmooth(image: Image; x, y: float32; wrapped = false): ColorRGBA</a></li>
</ul></dd>
<dt><a name="getRgbaUnsafe" href="#getRgbaUnsafe"><span>getRgbaUnsafe:</span></a></dt><dd><ul class="simple">
<li><a class="reference external"
@ -758,6 +754,10 @@ window.addEventListener('DOMContentLoaded', main);
<li><a class="reference external"
data-doc-search-tag="masks: setValueUnsafe(mask: Mask; x, y: int; value: uint8)" href="pixie/masks.html#setValueUnsafe%2CMask%2Cint%2Cint%2Cuint8">masks: setValueUnsafe(mask: Mask; x, y: int; value: uint8)</a></li>
</ul></dd>
<dt><a name="shadow" href="#shadow"><span>shadow:</span></a></dt><dd><ul class="simple">
<li><a class="reference external"
data-doc-search-tag="images: shadow(image: Image; offset: Vec2; spread, blur: float32; color: ColorRGBA): Image" href="pixie/images.html#shadow%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CColorRGBA">images: shadow(image: Image; offset: Vec2; spread, blur: float32; color: ColorRGBA): Image</a></li>
</ul></dd>
<dt><a name="shift" href="#shift"><span>shift:</span></a></dt><dd><ul class="simple">
<li><a class="reference external"
data-doc-search-tag="images: shift(target: Image | Mask; offset: Vec2)" href="pixie/images.html#shift%2C%2CVec2">images: shift(target: Image | Mask; offset: Vec2)</a></li>
@ -871,11 +871,17 @@ window.addEventListener('DOMContentLoaded', main);
data-doc-search-tag="common: toStraightAlpha(c: Color): Color" href="pixie/common.html#toStraightAlpha%2CColor">common: toStraightAlpha(c: Color): Color</a></li>
<li><a class="reference external"
data-doc-search-tag="common: toStraightAlpha(c: ColorRGBA): ColorRGBA" href="pixie/common.html#toStraightAlpha%2CColorRGBA">common: toStraightAlpha(c: ColorRGBA): ColorRGBA</a></li>
<li><a class="reference external"
data-doc-search-tag="images: toStraightAlpha(image: Image)" href="pixie/images.html#toStraightAlpha%2CImage">images: toStraightAlpha(image: Image)</a></li>
</ul></dd>
<dt><a name="TQuad" href="#TQuad"><span>TQuad:</span></a></dt><dd><ul class="simple">
<li><a class="reference external"
data-doc-search-tag="PathCommandKind.TQuad" href="pixie/paths.html#TQuad">PathCommandKind.TQuad</a></li>
</ul></dd>
<dt><a name="transform" href="#transform"><span>transform:</span></a></dt><dd><ul class="simple">
<li><a class="reference external"
data-doc-search-tag="paths: transform(path: var Path; mat: Mat3)" href="pixie/paths.html#transform%2CPath%2CMat3">paths: transform(path: var Path; mat: Mat3)</a></li>
</ul></dd>
<dt><a name="unpackAlphaValues" href="#unpackAlphaValues"><span>unpackAlphaValues:</span></a></dt><dd><ul class="simple">
<li><a class="reference external"
data-doc-search-tag="blends: unpackAlphaValues(v: M128i): M128i" href="pixie/blends.html#unpackAlphaValues%2CM128i">blends: unpackAlphaValues(v: M128i): M128i</a></li>
@ -917,7 +923,7 @@ window.addEventListener('DOMContentLoaded', main);
<div class="twelve-columns footer">
<span class="nim-sprite"></span>
<br/>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 15:26:22 UTC</small>
<small style="color: var(--hint);">Made with Nim. Generated: 2021-02-25 17:48:09 UTC</small>
</div>
</div>
</div>

31
examples/gradient.nim
View file

@ -1,9 +1,21 @@
import pixie
let
image = newImage(200, 200)
let image = newImage(200, 200)
image.fill(rgba(255, 255, 255, 255))
let paint = Paint(
kind: pkGradientRadial,
gradientHandlePositions: @[
vec2(100, 100),
vec2(200, 100),
vec2(100, 200)
],
gradientStops: @[
ColorStop(color: rgba(255, 0, 0, 255).color, position: 0),
ColorStop(color: rgba(255, 0, 0, 40).color, position: 1.0),
]
)
image.fillPath(
"""
M 20 60
@ -13,18 +25,7 @@ image.fillPath(
Q 20 120 20 60
z
""",
Paint(
kind:pkGradientRadial,
gradientHandlePositions: @[
vec2(100, 100),
vec2(200, 100),
vec2(100, 200)
],
gradientStops: @[
ColorStop(color:rgba(255, 0, 0, 255).color, position: 0),
ColorStop(color:rgba(255, 0, 0, 40).color, position: 1.0),
]
)
paint
)
image.writeFile("examples/paint.png")

4
examples/heart.nim
View file

@ -1,8 +1,6 @@
import pixie
let
image = newImage(200, 200)
let image = newImage(200, 200)
image.fill(rgba(255, 255, 255, 255))
image.fillPath(

8
examples/image_tiled.nim
View file

@ -1,8 +1,6 @@
import pixie
let
image = newImage(200, 200)
let image = newImage(200, 200)
image.fill(rgba(255, 255, 255, 255))
var path: Path
@ -14,9 +12,9 @@ path.polygon(
image.fillPath(
path,
Paint(
kind:pkImageTiled,
kind: pkImageTiled,
image: readImage("tests/images/png/baboon.png"),
imageMat:scale(vec2(0.08, 0.08))
imageMat: scale(vec2(0.08, 0.08))
)
)

BIN
examples/image_tiled.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 40 KiB

After

Width:  |  Height:  |  Size: 40 KiB

41
src/pixie.nim
View file

@ -1,9 +1,8 @@
import bumpy, chroma, flatty/binny, os, pixie/blends, pixie/common,
pixie/fileformats/bmp, pixie/fileformats/jpg, pixie/fileformats/png,
pixie/fileformats/svg, pixie/paints, pixie/images, pixie/masks,
pixie/paths, vmath
pixie/fileformats/svg, pixie/images, pixie/masks, pixie/paints, pixie/paths, vmath
export blends, bumpy, chroma, common, paints, images, masks, paths, vmath
export blends, bumpy, chroma, common, images, masks, paints, paths, vmath
type
FileFormat* = enum
@ -52,13 +51,13 @@ proc writeFile*(image: Image, filePath: string) =
image.writeFile(filePath, fileformat)
proc fillRect*(image: Image, rect: Rect, color: ColorRGBA) =
## Fill a rectangle.
## Fills a rectangle.
var path: Path
path.rect(rect)
image.fillPath(path, color)
proc fillRect*(mask: Mask, rect: Rect) =
## Fill a rectangle.
## Fills a rectangle.
var path: Path
path.rect(rect)
mask.fillPath(path)
@ -66,13 +65,13 @@ proc fillRect*(mask: Mask, rect: Rect) =
proc strokeRect*(
image: Image, rect: Rect, color: ColorRGBA, strokeWidth = 1.0
) =
## Stroke a rounded rectangle.
## Strokes a rectangle.
var path: Path
path.rect(rect)
image.strokePath(path, color, strokeWidth)
proc strokeRect*(mask: Mask, rect: Rect, strokeWidth = 1.0) =
## Stroke a rounded rectangle.
## Strokes a rectangle.
var path: Path
path.rect(rect)
mask.strokePath(path, strokeWidth)
@ -83,7 +82,7 @@ proc fillRoundedRect*(
nw, ne, se, sw: float32,
color: ColorRGBA
) =
## Fill a rounded rectangle.
## Fills a rounded rectangle.
var path: Path
path.roundedRect(rect, nw, ne, se, sw)
image.fillPath(path, color)
@ -94,19 +93,19 @@ proc fillRoundedRect*(
radius: float32,
color: ColorRGBA
) =
## Fill a rounded rectangle.
## Fills a rounded rectangle.
var path: Path
path.roundedRect(rect, radius, radius, radius, radius)
image.fillPath(path, color)
proc fillRoundedRect*(mask: Mask, rect: Rect, nw, ne, se, sw: float32) =
## Fill a rounded rectangle.
## Fills a rounded rectangle.
var path: Path
path.roundedRect(rect, nw, ne, se, sw)
mask.fillPath(path)
proc fillRoundedRect*(mask: Mask, rect: Rect, radius: float32) =
## Fill a rounded rectangle.
## Fills a rounded rectangle.
var path: Path
path.roundedRect(rect, radius, radius, radius, radius)
mask.fillPath(path)
@ -118,7 +117,7 @@ proc strokeRoundedRect*(
color: ColorRGBA,
strokeWidth = 1.0
) =
## Stroke a rounded rectangle.
## Strokes a rounded rectangle.
var path: Path
path.roundedRect(rect, nw, ne, se, sw)
image.strokePath(path, color, strokeWidth)
@ -130,7 +129,7 @@ proc strokeRoundedRect*(
color: ColorRGBA,
strokeWidth = 1.0
) =
## Stroke a rounded rectangle.
## Strokes a rounded rectangle.
var path: Path
path.roundedRect(rect, radius, radius, radius, radius)
image.strokePath(path, color, strokeWidth)
@ -138,7 +137,7 @@ proc strokeRoundedRect*(
proc strokeRoundedRect*(
mask: Mask, rect: Rect, nw, ne, se, sw: float32, strokeWidth = 1.0
) =
## Stroke a rounded rectangle.
## Strokes a rounded rectangle.
var path: Path
path.roundedRect(rect, nw, ne, se, sw)
mask.strokePath(path, strokeWidth)
@ -146,7 +145,7 @@ proc strokeRoundedRect*(
proc strokeRoundedRect*(
mask: Mask, rect: Rect, radius: float32, strokeWidth = 1.0
) =
## Stroke a rounded rectangle.
## Strokes a rounded rectangle.
var path: Path
path.roundedRect(rect, radius, radius, radius, radius)
mask.strokePath(path, strokeWidth)
@ -157,14 +156,14 @@ proc strokeSegment*(
color: ColorRGBA,
strokeWidth = 1.0
) =
## Stroke a segment (draws a line from segment.at to segment.to).
## Strokes a segment (draws a line from segment.at to segment.to).
var path: Path
path.moveTo(segment.at)
path.lineTo(segment.to)
image.strokePath(path, color, strokeWidth)
proc strokeSegment*(mask: Mask, segment: Segment, strokeWidth: float32) =
## Stroke a segment (draws a line from segment.at to segment.to).
## Strokes a segment (draws a line from segment.at to segment.to).
var path: Path
path.moveTo(segment.at)
path.lineTo(segment.to)
@ -177,7 +176,7 @@ proc fillEllipse*(
color: ColorRGBA,
blendMode = bmNormal
) =
## Fill an ellipse.
## Fills an ellipse.
var path: Path
path.ellipse(center, rx, ry)
image.fillPath(path, color, wrNonZero, blendMode)
@ -187,7 +186,7 @@ proc fillEllipse*(
center: Vec2,
rx, ry: float32
) =
## Fill an ellipse.
## Fills an ellipse.
var path: Path
path.ellipse(center, rx, ry)
mask.fillPath(path)
@ -199,7 +198,7 @@ proc strokeEllipse*(
color: ColorRGBA,
strokeWidth = 1.0
) =
## Stroke an ellipse.
## Strokes an ellipse.
var path: Path
path.ellipse(center, rx, ry)
image.strokePath(path, color, strokeWidth)
@ -210,7 +209,7 @@ proc strokeEllipse*(
rx, ry: float32,
strokeWidth = 1.0
) =
## Stroke an ellipse.
## Strokes an ellipse.
var path: Path
path.ellipse(center, rx, ry)
mask.strokePath(path, strokeWidth)

43
src/pixie/blends.nim
View file

@ -35,7 +35,6 @@ type
bmIntersectMask
bmExcludeMask
Blender* = proc(backdrop, source: ColorRGBA): ColorRGBA ## Function signature
## returned by blender.
Masker* = proc(backdrop, source: uint8): uint8 ## Function signature returned
@ -210,15 +209,15 @@ proc blendMultiply(backdrop, source: ColorRGBA): ColorRGBA =
result.b = blend(backdrop.b, backdrop.a, source.b, source.a)
result.a = blendAlpha(backdrop.a, source.a)
proc blendLinearBurn(backdrop, source: ColorRGBA): ColorRGBA =
let
backdrop = backdrop.toStraightAlpha()
source = source.toStraightAlpha()
result.r = min(0, backdrop.r.int32 + source.r.int32 - 255).uint8
result.g = min(0, backdrop.g.int32 + source.g.int32 - 255).uint8
result.b = min(0, backdrop.b.int32 + source.b.int32 - 255).uint8
result = alphaFix(backdrop, source, result)
result = result.toPremultipliedAlpha()
# proc blendLinearBurn(backdrop, source: ColorRGBA): ColorRGBA =
# let
# backdrop = backdrop.toStraightAlpha()
# source = source.toStraightAlpha()
# result.r = min(0, backdrop.r.int32 + source.r.int32 - 255).uint8
# result.g = min(0, backdrop.g.int32 + source.g.int32 - 255).uint8
# result.b = min(0, backdrop.b.int32 + source.b.int32 - 255).uint8
# result = alphaFix(backdrop, source, result)
# result = result.toPremultipliedAlpha()
proc blendColorBurn(backdrop, source: ColorRGBA): ColorRGBA =
let
@ -257,15 +256,15 @@ proc blendScreen(backdrop, source: ColorRGBA): ColorRGBA =
result.b = screen(backdrop.b, source.b)
result.a = blendAlpha(backdrop.a, source.a)
proc blendLinearDodge(backdrop, source: ColorRGBA): ColorRGBA =
let
backdrop = backdrop.toStraightAlpha()
source = source.toStraightAlpha()
result.r = min(backdrop.r.uint32 + source.r, 255).uint8
result.g = min(backdrop.g.uint32 + source.g, 255).uint8
result.b = min(backdrop.b.uint32 + source.b, 255).uint8
result = alphaFix(backdrop, source, result)
result = result.toPremultipliedAlpha()
# proc blendLinearDodge(backdrop, source: ColorRGBA): ColorRGBA =
# let
# backdrop = backdrop.toStraightAlpha()
# source = source.toStraightAlpha()
# result.r = min(backdrop.r.uint32 + source.r, 255).uint8
# result.g = min(backdrop.g.uint32 + source.g, 255).uint8
# result.b = min(backdrop.b.uint32 + source.b, 255).uint8
# result = alphaFix(backdrop, source, result)
# result = result.toPremultipliedAlpha()
proc blendColorDodge(backdrop, source: ColorRGBA): ColorRGBA =
let
@ -449,9 +448,9 @@ proc blendExcludeMask(backdrop, source: ColorRGBA): ColorRGBA =
proc blendOverwrite(backdrop, source: ColorRGBA): ColorRGBA =
source
proc blendWhite(backdrop, source: ColorRGBA): ColorRGBA =
## For testing
rgba(255, 255, 255, 255)
# proc blendWhite(backdrop, source: ColorRGBA): ColorRGBA =
# ## For testing
# rgba(255, 255, 255, 255)
proc blender*(blendMode: BlendMode): Blender =
## Returns a blend function for a given blend mode.

2
src/pixie/fileformats/svg.nim
View file

@ -339,7 +339,7 @@ proc draw(img: Image, node: XmlNode, ctxStack: var seq[Ctx]) =
raise newException(PixieError, "Unsupported SVG tag: " & node.tag & ".")
proc decodeSvg*(data: string, width = 0, height = 0): Image =
## Render SVG file and return the image.
## Render SVG file and return the image. Defaults to the SVG's view box size.
try:
let root = parseXml(data)
if root.tag != "svg":

6
src/pixie/images.nim
View file

@ -200,7 +200,7 @@ proc minifyBy2*(image: Image, power = 1): Image =
src = result
proc magnifyBy2*(image: Image, power = 1): Image =
## Scales image image up by 2 ^ power.
## Scales image up by 2 ^ power.
if power < 0:
raise newException(PixieError, "Cannot magnifyBy2 with negative power")
@ -543,7 +543,9 @@ proc getRgbaSmooth*(image: Image, x, y: float32, wrapped = false): ColorRGBA =
lerp(bottomMix, topMix, diffY)
proc drawCorrect(a, b: Image | Mask, mat = mat3(), tiled = false, blendMode = bmNormal) =
proc drawCorrect(
a, b: Image | Mask, mat = mat3(), tiled = false, blendMode = bmNormal
) =
## Draws one image onto another using matrix with color blending.
when type(a) is Image:

18
src/pixie/paints.nim
View file

@ -1,4 +1,4 @@
import chroma, common, images, vmath, blends
import blends, chroma, common, images, vmath
type
PaintKind* = enum
@ -13,19 +13,19 @@ type
## Paint used to fill paths.
case kind*: PaintKind
of pkSolid:
color*: ColorRGBA ## Color to fill with.
color*: ColorRGBA ## Color to fill with.
of pkImage, pkImageTiled:
image*: Image ## Image to fill with.
imageMat*: Mat3 ## Matrix of the filled image.
image*: Image ## Image to fill with.
imageMat*: Mat3 ## Matrix of the filled image.
of pkGradientLinear, pkGradientRadial, pkGradientAngular:
gradientHandlePositions*: seq[Vec2] ## Gradient positions (image space).
gradientStops*: seq[ColorStop] ## Color stops (gradient space).
blendMode*: BlendMode ## Blend mode.
gradientHandlePositions*: seq[Vec2] ## Gradient positions (image space).
gradientStops*: seq[ColorStop] ## Color stops (gradient space).
blendMode*: BlendMode ## Blend mode.
ColorStop* = object
## Color stop on a gradient curve.
color*: Color ## Color of the stop
position*: float32 ## Gradient Stop position 0..1.
color*: Color ## Color of the stop
position*: float32 ## Gradient Stop position 0..1.
proc toLineSpace(at, to, point: Vec2): float32 =
## Convert position on to where it would fall on a line between at and to.

38
src/pixie/paths.nim
View file

@ -1,4 +1,4 @@
import blends, bumpy, chroma, common, images, masks, strutils, vmath, paints
import blends, bumpy, chroma, common, images, masks, paints, strutils, vmath
when defined(amd64) and not defined(pixieNoSimd):
import nimsimd/sse2
@ -35,13 +35,13 @@ type
SomePath* = Path | string | seq[seq[Vec2]]
const epsilon = 0.0001 * PI ## Tiny value used for some computations.
const epsilon = 0.0001 * PI ## Tiny value used for some computations.
when defined(release):
{.push checks: off.}
proc maxScale(m: Mat3): float32 =
## What is the largest scale of this matrix.
## What is the largest scale factor of this matrix?
max(
vec2(m[0, 0], m[0, 1]).length,
vec2(m[1, 0], m[1, 1]).length
@ -89,7 +89,7 @@ proc `$`*(path: Path): string =
result.add " "
proc parsePath*(path: string): Path =
## Converts a SVG style path into seq of commands.
## Converts a SVG style path string into seq of commands.
if path.len == 0:
return
@ -398,7 +398,9 @@ proc arcTo*(path: var Path, ctrl1, ctrl2: Vec2, radius: float32) {.inline.} =
))
path.at = to
proc arcTo*(path: var Path, x1, y1, x2, y2, radius: float32) =
proc arcTo*(path: var Path, x1, y1, x2, y2, radius: float32) {.inline.} =
## Adds a circular arc to the current sub-path, using the given control
## points and radius.
path.arcTo(vec2(x1, y1), vec2(x2, y2), radius)
proc ellipticalArcTo*(
@ -419,6 +421,9 @@ proc ellipticalArcTo*(
path.at = vec2(x, y)
proc rect*(path: var Path, x, y, w, h: float32, clockwise = true) =
## Adds a rectangle.
## Clockwise param can be used to subtract a rect from a path when using
## even-odd winding rule.
if clockwise:
path.moveTo(x, y)
path.lineTo(x + w, y)
@ -434,12 +439,14 @@ proc rect*(path: var Path, x, y, w, h: float32, clockwise = true) =
proc rect*(path: var Path, pos: Vec2, wh: Vec2, clockwise = true) {.inline.} =
## Adds a rectangle.
## Clockwise param can be used to subtract a rect from a path using even-odd.
## Clockwise param can be used to subtract a rect from a path when using
## even-odd winding rule.
path.rect(pos.x, pos.y, wh.x, wh.y, clockwise)
proc rect*(path: var Path, rect: Rect, clockwise = true) {.inline.} =
## Adds a rectangle.
## Clockwise param can be used to subtract a rect from a path using even-odd.
## Clockwise param can be used to subtract a rect from a path when using
## even-odd winding rule.
path.rect(rect.x, rect.y, rect.w, rect.h, clockwise)
const splineCircleK = 4.0 * (-1.0 + sqrt(2.0)) / 3
@ -450,7 +457,8 @@ proc roundedRect*(
path: var Path, x, y, w, h, nw, ne, se, sw: float32, clockwise = true
) =
## Adds a rounded rectangle.
## Clockwise param can be used to subtract a rect from a path using even-odd.
## Clockwise param can be used to subtract a rect from a path when using
## even-odd winding rule.
let
s = splineCircleK
@ -505,14 +513,16 @@ proc roundedRect*(
path: var Path, pos, wh: Vec2, nw, ne, se, sw: float32, clockwise = true
) {.inline.} =
## Adds a rounded rectangle.
## Clockwise param can be used to subtract a rect from a path using even-odd.
## Clockwise param can be used to subtract a rect from a path when using
## even-odd winding rule.
path.roundedRect(pos.x, pos.y, wh.x, wh.y, nw, ne, se, sw, clockwise)
proc roundedRect*(
path: var Path, rect: Rect, nw, ne, se, sw: float32, clockwise = true
) {.inline.} =
## Adds a rounded rectangle.
## Clockwise param can be used to subtract a rect from a path using even-odd.
## Clockwise param can be used to subtract a rect from a path when using
## even-odd winding rule.
path.roundedRect(rect.x, rect.y, rect.w, rect.h, nw, ne, se, sw, clockwise)
proc ellipse*(path: var Path, cx, cy, rx, ry: float32) =
@ -533,7 +543,7 @@ proc ellipse*(path: var Path, center: Vec2, rx, ry: float32) {.inline.} =
path.ellipse(center.x, center.y, rx, ry)
proc polygon*(path: var Path, x, y, size: float32, sides: int) =
## Draws a n-sided regular polygon at (x, y) with a size.
## Draws an n-sided regular polygon at (x, y) with the parameter size.
path.moveTo(x + size * cos(0.0), y + size * sin(0.0))
for side in 0 .. sides:
path.lineTo(
@ -542,12 +552,11 @@ proc polygon*(path: var Path, x, y, size: float32, sides: int) =
)
proc polygon*(path: var Path, pos: Vec2, size: float32, sides: int) {.inline.} =
## Draws a n-sided regular polygon at (x, y) with a size.
## Draws a n-sided regular polygon at (x, y) with the parameter size.
path.polygon(pos.x, pos.y, size, sides)
proc commandsToShapes*(path: Path, pixelScale: float32 = 1.0): seq[seq[Vec2]] =
## Converts SVG-like commands to line segments.
var
start, at: Vec2
shape: seq[Vec2]
@ -910,7 +919,7 @@ iterator segments*(s: seq[Vec2]): Segment =
yield(segment(s[i], s[i + 1]))
proc quickSort(a: var seq[(float32, int16)], inl, inr: int) =
## Quick sorts inline faster then standard lib.
## Sorts in place + faster than standard lib sort.
var
r = inr
l = inl
@ -966,7 +975,6 @@ proc partitionSegments(
shapes: seq[seq[Vec2]], height: int
): seq[seq[(Segment, int16)]] =
## Puts segments into the height partitions they intersect with.
var segmentCount: int
for shape in shapes:
segmentCount += shape.len - 1

59
tests/test_paints.nim
View file

@ -14,8 +14,8 @@ block:
image.fillPath(
heartShape,
Paint(
kind:pkSolid,
color:rgba(255, 0, 0, 255)
kind: pkSolid,
color: rgba(255, 0, 0, 255)
)
)
image.writeFile("tests/images/paths/paintSolid.png")
@ -26,9 +26,9 @@ block:
image.fillPath(
heartShape,
Paint(
kind:pkImage,
image:decodePng(readFile("tests/images/png/baboon.png")),
imageMat:scale(vec2(0.2, 0.2))
kind: pkImage,
image: decodePng(readFile("tests/images/png/baboon.png")),
imageMat: scale(vec2(0.2, 0.2))
)
)
image.writeFile("tests/images/paths/paintImage.png")
@ -39,30 +39,29 @@ block:
image.fillPath(
heartShape,
Paint(
kind:pkImageTiled,
image:decodePng(readFile("tests/images/png/baboon.png")),
imageMat:scale(vec2(0.02, 0.02))
kind: pkImageTiled,
image: decodePng(readFile("tests/images/png/baboon.png")),
imageMat: scale(vec2(0.02, 0.02))
)
)
image.writeFile("tests/images/paths/paintImageTiled.png")
block:
let
image = newImage(100, 100)
image.fillPath(
heartShape,
Paint(
kind:pkGradientLinear,
kind: pkGradientLinear,
gradientHandlePositions: @[
vec2(0, 50),
vec2(100, 50),
],
gradientStops: @[
ColorStop(color:rgba(255, 0, 0, 255).color, position: 0),
ColorStop(color:rgba(255, 0, 0, 40).color, position: 1.0),
]
)
],
gradientStops: @[
ColorStop(color: rgba(255, 0, 0, 255).color, position: 0),
ColorStop(color: rgba(255, 0, 0, 40).color, position: 1.0),
]
)
)
image.writeFile("tests/images/paths/gradientLinear.png")
@ -72,17 +71,17 @@ block:
image.fillPath(
heartShape,
Paint(
kind:pkGradientRadial,
kind: pkGradientRadial,
gradientHandlePositions: @[
vec2(50, 50),
vec2(100, 50),
vec2(50, 100)
],
gradientStops: @[
ColorStop(color:rgba(255, 0, 0, 255).color, position: 0),
ColorStop(color:rgba(255, 0, 0, 40).color, position: 1.0),
]
)
],
gradientStops: @[
ColorStop(color: rgba(255, 0, 0, 255).color, position: 0),
ColorStop(color: rgba(255, 0, 0, 40).color, position: 1.0),
]
)
)
image.writeFile("tests/images/paths/gradientRadial.png")
@ -93,17 +92,17 @@ block:
image.fillPath(
heartShape,
Paint(
kind:pkGradientAngular,
kind: pkGradientAngular,
gradientHandlePositions: @[
vec2(50, 50),
vec2(100, 50),
vec2(50, 100)
],
gradientStops: @[
ColorStop(color:rgba(255, 0, 0, 255).color, position: 0),
ColorStop(color:rgba(255, 0, 0, 40).color, position: 1.0),
]
)
],
gradientStops: @[
ColorStop(color: rgba(255, 0, 0, 255).color, position: 0),
ColorStop(color: rgba(255, 0, 0, 40).color, position: 1.0),
]
)
)
image.writeFile("tests/images/paths/gradientAngular.png")