Flat, round, designer-friendly pseudo-3D engine for canvas & SVG
📝 revise .github, readme, comments
+23
-16
+10
-1
.github/contributing.md
+10
-1
.github/contributing.md
···
4
4
5
5
## Reduced test cases required
6
6
7
-
All bug reports and problem issues require a [**reduced test case**](https://css-tricks.com/reduced-test-cases/). Create one by [forking this CodePen](https://codepen.io/desandro/pen/xNLWwG).
7
+
All bug reports and problem issues require a [**reduced test case**](https://css-tricks.com/reduced-test-cases/). Create one by forking this any one of the [Zdog demos on CodePen](https://codepen.io/desandro/pens/tags/?grid_type=list&selected_tag=zdog-v1-docs&sort_col=created_at&sort_order=asc).
8
+
9
+
**CodePen**
10
+
11
+
+ [Hello world canvas](https://codepen.io/desandro/pen/YbrLaO)
12
+
+ [Hello world SVG](https://codepen.io/desandro/pen/Bewxme)
13
+
+ [resize fullscreen](https://codepen.io/desandro/pen/dEJxaV)
14
+
+ [Stutter](https://codepen.io/desandro/pen/xNPaoP)
15
+
16
+
**Test cases**
8
17
9
18
+ A reduced test case clearly demonstrates the bug or issue.
10
19
+ It contains the bare minimum HTML, CSS, and JavaScript required to demonstrate the bug.
+2
-2
.github/issue_template.md
+2
-2
.github/issue_template.md
···
1
-
<!-- Thanks for submitting an issue! If you have a bug or problem issue, please include a **reduced test case**. Create one in CodePen or other demo site. See guidelines link above. -->
1
+
<!-- Thanks for submitting an issue! If you have a bug or problem issue, please include a **reduced test case**. Create one in CodePen or other demo site. See contributing guidelines. -->
2
2
3
-
**Test case:** https://codepen.io/desandro/pen/xNLWwG
3
+
**Test case:** https://codepen.io/desandro/pen/YbrLaO
+2
-2
README.md
+2
-2
README.md
···
32
32
``` js
33
33
let isSpinning = true;
34
34
35
-
const illo = new Zdog.Illustration({
35
+
let illo = new Zdog.Illustration({
36
36
element: '.zdog-canvas',
37
37
zoom: 4,
38
38
dragRotate: true,
···
86
86
87
87
### Other Zdog repos
88
88
89
-
+ [zdog-demos](https://github.com/metafizzy/zdog-demos) - More, bigger, wilder Zdog demos
89
+
+ [zdog-demos](https://github.com/metafizzy/zdog-demos) - Bigger, wilder Zdog demos
90
90
+ [zdog-docs](https://github.com/metafizzy/zdog-docs) - Documentation site source code for [zzz.dog](https://zzz.dog)
91
91
92
92
---
+4
-6
demos/hemisphere-cone-ball/hemisphere-cone-ball.js
+4
-6
demos/hemisphere-cone-ball/hemisphere-cone-ball.js
···
23
23
var garnet = '#C25';
24
24
var eggplant = '#636';
25
25
26
-
// -- illustration shapes --- //
26
+
// ----- model ----- //
27
27
28
28
var hemi = new Zdog.Hemisphere({
29
29
addTo: illo,
···
68
68
}
69
69
});
70
70
71
-
// -- animate --- //
71
+
// ----- animate ----- //
72
72
73
73
var keyframes = [
74
74
{ x: TAU * 0, y: TAU * 0 },
···
86
86
requestAnimationFrame( animate );
87
87
}
88
88
89
-
animate();
90
-
91
-
// -- update -- //
92
-
93
89
function spin() {
94
90
if ( !isSpinning ) {
95
91
return;
···
104
100
illo.rotate.y = Zdog.lerp( keyA.y, keyB.y, tween ) ;
105
101
ticker++;
106
102
}
103
+
104
+
animate();
+3
-3
demos/kid-kit/kid-kit.js
+3
-3
demos/kid-kit/kid-kit.js
···
1
-
// --- variables --- //
1
+
// ----- setup ----- //
2
2
3
3
var offWhite = '#FED';
4
4
var gold = '#EA0';
···
11
11
dragRotate: true,
12
12
});
13
13
14
-
// --- model --- //
14
+
// ----- model ----- //
15
15
16
16
// body center
17
17
new Zdog.Shape({
···
294
294
});
295
295
296
296
297
-
// -- animate --- //
297
+
// ----- animate ----- //
298
298
299
299
function animate() {
300
300
illo.updateRenderGraph();
+1
-1
demos/shade-and-shades/shade-and-shades.js
+1
-1
demos/shade-and-shades/shade-and-shades.js