better planets
This commit is contained in:
ajuvercr
parent
366f3361d9
commit
26d964637d
3
frontend/package-lock.json
generated
Normal file
3
frontend/package-lock.json
generated
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"lockfileVersion": 1
|
||||
}
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
import { Game } from "planetwars";
|
||||
import { memory } from "planetwars/plantwars_bg";
|
||||
import { Resizer, resizeCanvasToDisplaySize, FPSCounter } from "./webgl/util";
|
||||
import { Shader, Uniform4f, Uniform2fv, Uniform3fv, Uniform1i, Uniform1f, Uniform2f, ShaderFactory } from './webgl/shader';
|
||||
import { Resizer, resizeCanvasToDisplaySize, FPSCounter, url_to_mesh, Mesh } from "./webgl/util";
|
||||
import { Shader, Uniform4f, Uniform2fv, Uniform3fv, Uniform1i, Uniform1f, Uniform2f, ShaderFactory, Uniform3f, UniformMatrix3fv } from './webgl/shader';
|
||||
import { Renderer } from "./webgl/renderer";
|
||||
import { VertexBuffer, IndexBuffer } from "./webgl/buffer";
|
||||
import { VertexBufferLayout, VertexArray } from "./webgl/vertexBufferLayout";
|
||||
|
|
@ -34,6 +34,8 @@ const CANVAS = <HTMLCanvasElement>document.getElementById("c");
|
|||
const RESOLUTION = [CANVAS.width, CANVAS.height];
|
||||
|
||||
const GL = CANVAS.getContext("webgl");
|
||||
|
||||
|
||||
resizeCanvasToDisplaySize(<HTMLCanvasElement>GL.canvas);
|
||||
GL.viewport(0, 0, GL.canvas.width, GL.canvas.height);
|
||||
|
||||
|
|
@ -43,23 +45,6 @@ GL.clear(GL.COLOR_BUFFER_BIT);
|
|||
GL.enable(GL.BLEND);
|
||||
GL.blendFunc(GL.SRC_ALPHA, GL.ONE_MINUS_SRC_ALPHA);
|
||||
|
||||
const positionBuffer = new VertexBuffer(GL, [
|
||||
-1, -1,
|
||||
-1, 1,
|
||||
1, -1,
|
||||
1, 1,
|
||||
]);
|
||||
|
||||
const layout = new VertexBufferLayout();
|
||||
layout.push(GL.FLOAT, 2, 4, "a_position");
|
||||
const vao = new VertexArray();
|
||||
vao.addBuffer(positionBuffer, layout);
|
||||
|
||||
const indexBuffer = new IndexBuffer(GL, [
|
||||
0, 1, 2,
|
||||
1, 2, 3,
|
||||
]);
|
||||
|
||||
var SHADERFACOTRY: ShaderFactory;
|
||||
ShaderFactory.create_factory(
|
||||
LOCATION + "static/shaders/frag/simple.glsl", LOCATION + "static/shaders/vert/simple.glsl"
|
||||
|
|
@ -75,13 +60,53 @@ class GameInstance {
|
|||
last_time = 0;
|
||||
frame = -1;
|
||||
|
||||
constructor(game: Game) {
|
||||
constructor(game: Game, meshes: Mesh[]) {
|
||||
this.game = game;
|
||||
this.planet_count = this.game.get_planet_count();
|
||||
this.shader = SHADERFACOTRY.create_shader(GL, {"MAX_CIRCLES": ''+this.planet_count});
|
||||
this.resizer = new Resizer(CANVAS, [...f32v(game.get_viewbox(), 4)], true);
|
||||
this.renderer = new Renderer();
|
||||
this.renderer.addToDraw(indexBuffer, vao, this.shader);
|
||||
// this.renderer.addToDraw(indexBuffer, vao, this.shader);
|
||||
this.game.update_turn(10);
|
||||
|
||||
const planets = f32v(game.get_planets(), this.planet_count * 3);
|
||||
const colours = f32v(game.get_planet_colors(), this.planet_count * 3);
|
||||
|
||||
console.log(planets.length);
|
||||
console.log(colours.length);
|
||||
|
||||
|
||||
console.log(this.planet_count);
|
||||
for(let i=0; i < this.planet_count; i++){
|
||||
const colour = new Uniform3f(colours[i*3], colours[i*3 + 1], colours[i*3 + 2]);
|
||||
|
||||
console.log(colour);
|
||||
|
||||
const transform = new UniformMatrix3fv([
|
||||
1, 0, 0,
|
||||
0, 1, 0,
|
||||
planets[i*3], planets[i*3+1], 1,
|
||||
]);
|
||||
|
||||
const indexBuffer = new IndexBuffer(GL, meshes[i % meshes.length].cells);
|
||||
|
||||
const positionBuffer = new VertexBuffer(GL, meshes[i % meshes.length].positions);
|
||||
|
||||
const layout = new VertexBufferLayout();
|
||||
layout.push(GL.FLOAT, 3, 4, "a_position");
|
||||
const vao = new VertexArray();
|
||||
vao.addBuffer(positionBuffer, layout);
|
||||
|
||||
this.renderer.addToDraw(
|
||||
indexBuffer,
|
||||
vao,
|
||||
this.shader,
|
||||
{
|
||||
"u_color": colour,
|
||||
"u_trans": transform,
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
// this.game.update_turn(this.frame);
|
||||
|
||||
|
|
@ -94,27 +119,38 @@ class GameInstance {
|
|||
this.last_time = time;
|
||||
this.frame ++;
|
||||
this.game.update_turn(this.frame);
|
||||
}
|
||||
|
||||
this.shader.uniform(GL, "u_circle_count", new Uniform1i(this.planet_count));
|
||||
const colours = f32v(this.game.get_planet_colors(), this.planet_count * 3);
|
||||
for(let i=0; i < this.planet_count; i++){
|
||||
const u = new Uniform3f(colours[i*3], colours[i*3 + 1], colours[i*3 + 2]);
|
||||
this.renderer.updateUniform(i, (us) => us["u_color"] = u);
|
||||
}
|
||||
}
|
||||
GL.bindFramebuffer(GL.FRAMEBUFFER, null);
|
||||
GL.viewport(0, 0, GL.canvas.width, GL.canvas.height);
|
||||
GL.clear(GL.COLOR_BUFFER_BIT | GL.DEPTH_BUFFER_BIT);
|
||||
|
||||
this.shader.uniform(GL, "u_time", new Uniform1f(time * 0.001));
|
||||
this.shader.uniform(GL, "u_mouse", new Uniform2f(this.resizer.get_mouse_pos()));
|
||||
this.shader.uniform(GL, "u_viewbox", new Uniform4f(this.resizer.get_viewbox()));
|
||||
this.shader.uniform(GL, "u_resolution", new Uniform2f(RESOLUTION));
|
||||
|
||||
this.shader.uniform(GL, "u_circles", new Uniform3fv(f32v(this.game.get_planets(), 3 * this.planet_count)));
|
||||
this.shader.uniform(GL, "u_colors", new Uniform3fv(f32v(this.game.get_planet_colors(), 3 * this.planet_count)));
|
||||
|
||||
this.renderer.render(GL);
|
||||
|
||||
COUNTER.frame(time);
|
||||
}
|
||||
}
|
||||
|
||||
var game_instance: GameInstance;
|
||||
|
||||
export function set_instance(game: Game) {
|
||||
game_instance = new GameInstance(game);
|
||||
export async function set_instance(game: Game) {
|
||||
const meshes = await Promise.all(
|
||||
["earth.svg", "jupiter.svg", "mars.svg"].map(
|
||||
(name) => "static/res/assets/" + name
|
||||
).map(url_to_mesh)
|
||||
);
|
||||
console.log(meshes[0]);
|
||||
game_instance = new GameInstance(game, meshes);
|
||||
|
||||
console.log(game.turn_count());
|
||||
|
||||
|
|
|
|||
877
frontend/www/package-lock.json
generated
877
frontend/www/package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
|
@ -20,7 +20,10 @@
|
|||
"mozaic"
|
||||
],
|
||||
"dependencies": {
|
||||
"planetwars": "file:../pkg"
|
||||
"planetwars": "file:../pkg",
|
||||
"extract-svg-path": "^2.1.0",
|
||||
"load-svg": "^1.0.0",
|
||||
"svg-mesh-3d": "^1.1.0"
|
||||
},
|
||||
"author": "Arthur Vercruysse <arthur.vercruysse@outlook.com>",
|
||||
"license": "(MIT OR Apache-2.0)",
|
||||
|
|
|
|||
114
frontend/www/static/res/assets/earth.svg
Normal file
114
frontend/www/static/res/assets/earth.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 7.4 KiB |
118
frontend/www/static/res/assets/jupiter.svg
Normal file
118
frontend/www/static/res/assets/jupiter.svg
Normal file
|
|
@ -0,0 +1,118 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
id="Capa_1"
|
||||
x="0px"
|
||||
y="0px"
|
||||
viewBox="0 0 493.0475 493.16002"
|
||||
xml:space="preserve"
|
||||
sodipodi:docname="jupiter-with-satellite.svg"
|
||||
width="493.04749"
|
||||
height="493.16"
|
||||
inkscape:version="0.92.1 r15371"><metadata
|
||||
id="metadata45"><rdf:RDF><cc:Work
|
||||
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
|
||||
id="defs43" /><sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1536"
|
||||
inkscape:window-height="801"
|
||||
id="namedview41"
|
||||
showgrid="false"
|
||||
inkscape:zoom="0.38562218"
|
||||
inkscape:cx="-121.54471"
|
||||
inkscape:cy="246.58001"
|
||||
inkscape:window-x="-8"
|
||||
inkscape:window-y="-8"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="g8" />
|
||||
<g
|
||||
id="g8"
|
||||
transform="translate(-118.9515,-59.419)">
|
||||
<path
|
||||
d="M 539.776,131.64 C 493.205,85.067 431.282,59.419 365.417,59.419 c -65.865,0 -127.785,25.649 -174.359,72.221 -96.142,96.142 -96.142,252.575 0,348.718 46.573,46.573 108.494,72.221 174.359,72.221 65.865,0 127.786,-25.648 174.359,-72.221 46.574,-46.573 72.223,-108.494 72.223,-174.359 0,-65.865 -25.647,-127.786 -72.223,-174.359 z M 375.169,405.983 c -12.849,11.452 -28.27,18.565 -40.247,18.565 -3.901,0 -9.259,-0.794 -12.626,-4.57 -3.823,-4.287 -4.311,-11.821 -1.337,-20.669 3.484,-10.375 11.047,-21.12 21.292,-30.252 12.849,-11.452 28.27,-18.565 40.247,-18.565 3.901,0 9.259,0.794 12.626,4.568 9.699,10.882 -2.733,35.57 -19.955,50.923 z m -59.521,27.38 c 5.126,3.72 11.674,5.68 19.274,5.68 15.617,0 34.268,-8.313 49.89,-22.24 23.566,-21.006 33.496,-48.135 25.096,-65.431 0.069,-0.069 0.138,-0.134 0.205,-0.203 l 0.245,-0.245 c 56.354,-56.355 104.89,-119.767 140.932,-183.964 9.652,12.849 17.879,26.565 24.597,40.957 -35.262,61.327 -80.521,119.83 -134.614,173.92 -54.098,54.099 -112.607,99.362 -173.935,134.623 -14.394,-6.719 -28.111,-14.945 -40.961,-24.599 30.178,-16.937 60.136,-36.571 89.271,-58.498 z M 466.754,97.09 c -35.38,61.735 -80.828,120.58 -135.241,174.991 -54.389,54.389 -113.209,99.824 -174.915,135.197 -5.757,-11.897 -10.44,-24.186 -14.05,-36.725 56.493,-34.46 110.419,-77.182 160.338,-127.099 49.957,-49.957 92.703,-103.921 127.17,-160.452 12.628,3.642 24.897,8.353 36.698,14.088 z m -265.444,44.8 c 43.835,-43.835 102.116,-67.977 164.109,-67.977 7.242,0 14.43,0.342 21.555,0.995 -31.234,48.087 -68.655,94.211 -111.341,137.176 -2.821,2.839 -2.807,7.429 0.034,10.25 1.413,1.404 3.262,2.107 5.108,2.107 1.863,0 3.725,-0.714 5.142,-2.14 44.565,-44.857 84.642,-94.977 116.958,-145.384 4.187,0.676 8.346,1.459 12.472,2.359 -33.458,54.163 -74.692,105.911 -122.709,153.927 -47.981,47.981 -99.69,89.192 -153.82,122.642 -16.314,-74.713 4.517,-155.981 62.492,-213.955 z m -37.988,278.24 c 62.996,-36.051 123.004,-82.362 178.439,-137.797 55.457,-55.457 101.781,-115.487 137.837,-178.506 18.062,10.238 34.849,22.985 49.928,38.064 4.164,4.164 8.148,8.46 11.953,12.874 -35.656,64.768 -84.421,128.944 -141.318,185.854 -4.865,-3.019 -10.834,-4.622 -17.665,-4.622 -15.617,0 -34.269,8.313 -49.892,22.24 -12.097,10.783 -21.113,23.731 -25.389,36.457 -3.457,10.294 -3.575,19.665 -0.495,27.248 -30.198,22.709 -61.277,42.902 -92.54,60.113 -4.414,-3.803 -8.708,-7.786 -12.872,-11.95 -15.228,-15.229 -27.882,-32.071 -37.986,-49.975 z m 366.205,49.976 c -43.835,43.835 -102.116,67.977 -164.109,67.977 -15.161,0 -30.098,-1.453 -44.659,-4.276 18.864,-11.87 37.661,-24.833 55.998,-38.625 3.2,-2.406 3.841,-6.951 1.435,-10.149 -2.406,-3.2 -6.952,-3.84 -10.149,-1.435 -19.855,14.934 -46.393,32.45 -67.363,45.368 -5.606,-1.62 -11.142,-3.448 -16.596,-5.487 58.968,-35.049 115.237,-79.19 167.435,-131.388 52.192,-52.19 96.333,-108.454 131.381,-167.423 2.049,5.485 3.887,11.051 5.512,16.69 -23.941,38.799 -55.866,83.002 -87.51,118.944 -2.645,3.004 -2.356,7.585 0.649,10.228 1.379,1.212 3.086,1.808 4.787,1.808 2.009,0 4.012,-0.832 5.443,-2.459 30.673,-34.837 58.031,-71.308 81.446,-108.536 2.821,14.559 4.276,29.493 4.276,44.652 10e-4,61.995 -24.139,120.276 -67.976,164.111 z"
|
||||
id="path2"
|
||||
inkscape:connector-curvature="0" />
|
||||
|
||||
<path
|
||||
d="m 337.815,406.147 c -4.829,-5.418 0.615,-18.151 12.159,-28.441 11.544,-10.29 24.817,-14.24 29.646,-8.822 4.829,5.417 -0.615,18.151 -12.159,28.441 -11.545,10.29 -24.817,14.24 -29.646,8.822 z"
|
||||
id="path6"
|
||||
inkscape:connector-curvature="0" />
|
||||
</g>
|
||||
<g
|
||||
id="g10"
|
||||
transform="translate(-118.9515,-59.419)">
|
||||
</g>
|
||||
<g
|
||||
id="g12"
|
||||
transform="translate(-118.9515,-59.419)">
|
||||
</g>
|
||||
<g
|
||||
id="g14"
|
||||
transform="translate(-118.9515,-59.419)">
|
||||
</g>
|
||||
<g
|
||||
id="g16"
|
||||
transform="translate(-118.9515,-59.419)">
|
||||
</g>
|
||||
<g
|
||||
id="g18"
|
||||
transform="translate(-118.9515,-59.419)">
|
||||
</g>
|
||||
<g
|
||||
id="g20"
|
||||
transform="translate(-118.9515,-59.419)">
|
||||
</g>
|
||||
<g
|
||||
id="g22"
|
||||
transform="translate(-118.9515,-59.419)">
|
||||
</g>
|
||||
<g
|
||||
id="g24"
|
||||
transform="translate(-118.9515,-59.419)">
|
||||
</g>
|
||||
<g
|
||||
id="g26"
|
||||
transform="translate(-118.9515,-59.419)">
|
||||
</g>
|
||||
<g
|
||||
id="g28"
|
||||
transform="translate(-118.9515,-59.419)">
|
||||
</g>
|
||||
<g
|
||||
id="g30"
|
||||
transform="translate(-118.9515,-59.419)">
|
||||
</g>
|
||||
<g
|
||||
id="g32"
|
||||
transform="translate(-118.9515,-59.419)">
|
||||
</g>
|
||||
<g
|
||||
id="g34"
|
||||
transform="translate(-118.9515,-59.419)">
|
||||
</g>
|
||||
<g
|
||||
id="g36"
|
||||
transform="translate(-118.9515,-59.419)">
|
||||
</g>
|
||||
<g
|
||||
id="g38"
|
||||
transform="translate(-118.9515,-59.419)">
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.9 KiB |
114
frontend/www/static/res/assets/mars.svg
Normal file
114
frontend/www/static/res/assets/mars.svg
Normal file
|
|
@ -0,0 +1,114 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
id="Capa_1"
|
||||
x="0px"
|
||||
y="0px"
|
||||
viewBox="0 0 272.17 272.17"
|
||||
xml:space="preserve"
|
||||
sodipodi:docname="mars-with-satellite.svg"
|
||||
width="272.17001"
|
||||
height="272.17001"
|
||||
inkscape:version="0.92.1 r15371"><metadata
|
||||
id="metadata43"><rdf:RDF><cc:Work
|
||||
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
|
||||
id="defs41" /><sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1536"
|
||||
inkscape:window-height="801"
|
||||
id="namedview39"
|
||||
showgrid="false"
|
||||
inkscape:zoom="0.74916113"
|
||||
inkscape:cx="-15.912826"
|
||||
inkscape:cy="157.50949"
|
||||
inkscape:window-x="-8"
|
||||
inkscape:window-y="-8"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="g6" />
|
||||
<g
|
||||
id="g6"
|
||||
transform="translate(-14.578,-42.849)">
|
||||
<path
|
||||
d="m 150.663,42.849 c -75.037,0 -136.085,61.047 -136.085,136.085 0,75.038 61.048,136.085 136.085,136.085 75.037,0 136.085,-61.048 136.085,-136.085 0,-75.037 -61.048,-136.085 -136.085,-136.085 z m 94.519,49.737 C 215.47,98.072 194.155,95.67 181.775,85.417 166.119,72.442 142.824,62.802 112.41,56.684 c 12.085,-3.79 24.935,-5.835 38.253,-5.835 37.388,0 71.082,16.104 94.519,41.737 z M 49.864,99.992 c 7.659,4.116 14.848,7.336 20.496,9.16 l 1.405,0.455 c 11.474,3.718 26.173,8.48 38.353,8.48 9.974,0 18.259,-3.194 21.701,-12.769 1.564,-4.354 1.492,-8.272 -0.214,-11.644 -3.639,-7.188 -13.464,-10.107 -25.902,-13.801 -2.913,-0.865 -5.924,-1.76 -8.986,-2.75 -4.31,-1.395 -10.33,-3.021 -17.181,-4.657 5.813,-3.896 11.958,-7.332 18.388,-10.249 35.034,5.547 62.249,15.687 78.747,29.361 9.52,7.883 23.149,11.833 40.721,11.833 9.978,0 21.246,-1.291 33.734,-3.842 3.017,3.811 5.819,7.799 8.394,11.942 -7.815,0.09 -15.483,0.207 -23.256,0.357 -32.772,0.63 -51.646,9.594 -69.899,18.262 -16.304,7.742 -31.704,15.056 -56.158,15.056 -19.363,0 -45.543,-6.853 -75.875,-19.812 4.196,-9.082 9.42,-17.595 15.532,-25.382 z M 71.002,78.711 c 9.393,2.083 17.789,4.256 23.251,6.023 3.154,1.021 6.213,1.929 9.171,2.808 9.751,2.896 18.96,5.631 21.043,9.745 0.436,0.861 0.892,2.351 -0.177,5.326 -4.637,12.897 -27.272,6.767 -50.06,-0.616 L 72.82,101.54 C 67.967,99.972 61.794,97.234 55.123,93.723 59.98,88.283 65.292,83.259 71.002,78.711 Z M 23.02,168.333 c 35.942,5.647 57.003,15.954 59.452,29.178 0.284,1.535 -0.071,2.922 -1.119,4.364 -2.927,4.03 -13.653,11.492 -52.407,16.946 -4.126,-12.559 -6.367,-25.966 -6.367,-39.887 -0.001,-3.57 0.153,-7.104 0.441,-10.601 z m 23.365,84.896 c 22.439,-3.993 52.181,-14.162 77.357,-39.338 42.857,-42.857 53.898,-42.857 78.089,-42.857 9.532,0 21.889,5.026 34.971,10.348 13.57,5.52 27.555,11.194 41.059,12.592 -0.781,6.647 -2.069,13.141 -3.832,19.44 -9.441,0.149 -18.893,-1.263 -28.848,-2.765 -23.035,-3.475 -49.144,-7.414 -80.863,8.749 -36.661,18.676 -56.554,50.852 -67.026,75.957 -20.42,-9.398 -37.963,-24.01 -50.907,-42.126 z m 68.931,48.827 c -3.62,-1.041 -7.173,-2.242 -10.656,-3.586 9.935,-23.833 28.755,-54.35 63.288,-71.943 29.436,-14.998 53.129,-11.422 76.039,-7.966 9.394,1.417 18.359,2.748 27.51,2.855 -2.915,8.266 -6.65,16.149 -11.117,23.543 -29.036,-6.441 -59.028,-1.667 -89.203,14.214 -24.231,12.752 -43.497,30.024 -55.861,42.883 z m 35.347,4.963 c -9.027,0 -17.837,-0.944 -26.341,-2.729 11.947,-11.958 29.304,-26.84 50.581,-38.037 27.413,-14.427 54.562,-19.154 80.787,-14.093 -23.175,33.139 -61.609,54.859 -105.027,54.859 z M 278.55,186.003 c -12.347,-1.311 -25.739,-6.745 -38.734,-12.031 -13.827,-5.625 -26.889,-10.938 -37.985,-10.938 -27.418,0 -40.278,1.733 -83.745,45.2 -25.043,25.043 -54.972,34.354 -76.548,37.691 -3.79,-6.151 -7.074,-12.644 -9.795,-19.422 31.269,-4.529 49.643,-11.06 56.083,-19.926 2.324,-3.201 3.193,-6.839 2.513,-10.521 -3.943,-21.297 -37.42,-31.136 -66.412,-35.676 1.399,-9.598 3.865,-18.853 7.275,-27.643 31.702,13.558 58.277,20.448 79.003,20.448 26.258,0 42.448,-7.689 59.59,-15.83 17.488,-8.305 35.571,-16.893 66.622,-17.49 9.222,-0.177 18.305,-0.308 27.659,-0.402 9.362,17.782 14.672,38.016 14.672,59.47 0,2.373 -0.07,4.729 -0.198,7.07 z"
|
||||
id="path2"
|
||||
inkscape:connector-curvature="0" />
|
||||
|
||||
</g>
|
||||
<g
|
||||
id="g8"
|
||||
transform="translate(-14.578,-42.849)">
|
||||
</g>
|
||||
<g
|
||||
id="g10"
|
||||
transform="translate(-14.578,-42.849)">
|
||||
</g>
|
||||
<g
|
||||
id="g12"
|
||||
transform="translate(-14.578,-42.849)">
|
||||
</g>
|
||||
<g
|
||||
id="g14"
|
||||
transform="translate(-14.578,-42.849)">
|
||||
</g>
|
||||
<g
|
||||
id="g16"
|
||||
transform="translate(-14.578,-42.849)">
|
||||
</g>
|
||||
<g
|
||||
id="g18"
|
||||
transform="translate(-14.578,-42.849)">
|
||||
</g>
|
||||
<g
|
||||
id="g20"
|
||||
transform="translate(-14.578,-42.849)">
|
||||
</g>
|
||||
<g
|
||||
id="g22"
|
||||
transform="translate(-14.578,-42.849)">
|
||||
</g>
|
||||
<g
|
||||
id="g24"
|
||||
transform="translate(-14.578,-42.849)">
|
||||
</g>
|
||||
<g
|
||||
id="g26"
|
||||
transform="translate(-14.578,-42.849)">
|
||||
</g>
|
||||
<g
|
||||
id="g28"
|
||||
transform="translate(-14.578,-42.849)">
|
||||
</g>
|
||||
<g
|
||||
id="g30"
|
||||
transform="translate(-14.578,-42.849)">
|
||||
</g>
|
||||
<g
|
||||
id="g32"
|
||||
transform="translate(-14.578,-42.849)">
|
||||
</g>
|
||||
<g
|
||||
id="g34"
|
||||
transform="translate(-14.578,-42.849)">
|
||||
</g>
|
||||
<g
|
||||
id="g36"
|
||||
transform="translate(-14.578,-42.849)">
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.6 KiB |
186
frontend/www/static/res/assets/neptune.svg
Normal file
186
frontend/www/static/res/assets/neptune.svg
Normal file
|
|
@ -0,0 +1,186 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
id="Capa_1"
|
||||
x="0px"
|
||||
y="0px"
|
||||
viewBox="0 0 272.044 272.17001"
|
||||
xml:space="preserve"
|
||||
sodipodi:docname="neptune-with-satellite.svg"
|
||||
width="272.04401"
|
||||
height="272.17001"
|
||||
inkscape:version="0.92.1 r15371"><metadata
|
||||
id="metadata79"><rdf:RDF><cc:Work
|
||||
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
|
||||
id="defs77" /><sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1536"
|
||||
inkscape:window-height="801"
|
||||
id="namedview75"
|
||||
showgrid="false"
|
||||
inkscape:zoom="0.75655574"
|
||||
inkscape:cx="-13.59678"
|
||||
inkscape:cy="155.969"
|
||||
inkscape:window-x="-8"
|
||||
inkscape:window-y="-8"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="g42" />
|
||||
<g
|
||||
id="g42"
|
||||
transform="translate(-12.275,-39.769)">
|
||||
<path
|
||||
d="m 148.297,39.769 c -36.35,0 -70.524,14.155 -96.227,39.858 -53.06,53.06 -53.06,139.394 0,192.454 25.703,25.703 59.877,39.858 96.227,39.858 36.35,0 70.524,-14.155 96.227,-39.858 53.06,-53.06 53.06,-139.394 0,-192.454 C 218.821,53.924 184.647,39.769 148.297,39.769 Z M 271.474,165.86 c -8.235,-5.915 -18.998,-2.783 -29.532,8.588 -8.691,9.382 -15.31,21.945 -19.67,37.341 -0.602,2.125 0.633,4.336 2.759,4.938 2.127,0.601 4.336,-0.634 4.938,-2.759 4.013,-14.169 10.016,-25.637 17.842,-34.084 3.54,-3.822 12.475,-12.208 18.997,-7.527 8.074,5.799 7.154,21.44 6.385,27.895 -1.709,14.318 -7.573,26.757 -15.687,33.274 -2.358,1.895 -5.645,3.751 -7.902,1.84 -2.635,-2.23 -3.822,-7.371 -3.344,-14.476 0.148,-2.204 -1.519,-4.111 -3.723,-4.26 -2.226,-0.138 -4.111,1.519 -4.26,3.723 -0.672,9.986 1.399,17.091 6.158,21.119 2.164,1.832 4.646,2.741 7.302,2.741 1.832,0 3.748,-0.447 5.699,-1.306 -5.142,8.369 -11.327,16.273 -18.569,23.516 -1.59,1.59 -3.216,3.13 -4.873,4.625 -3.667,-4.799 -6.198,-12.047 -7.225,-20.88 -0.256,-2.194 -2.241,-3.763 -4.437,-3.511 -2.194,0.255 -3.766,2.241 -3.511,4.436 1.23,10.565 4.34,19.14 9.059,25.132 -16.61,13.223 -36.039,21.995 -56.813,25.702 5.189,-6.479 10.531,-16.472 12.156,-31.099 0.244,-2.196 -1.338,-4.173 -3.534,-4.417 -2.186,-0.244 -4.173,1.338 -4.417,3.534 -2.288,20.594 -12.727,30.327 -17.241,33.631 -3.223,0.241 -6.469,0.364 -9.735,0.364 -34.213,0 -66.378,-13.323 -90.57,-37.516 -33.004,-33.004 -44.189,-79.685 -33.57,-121.967 11.195,1.303 26.82,4.299 43.035,11.16 0.509,0.215 1.037,0.317 1.557,0.317 1.559,0 3.04,-0.917 3.686,-2.442 0.861,-2.034 -0.09,-4.381 -2.125,-5.242 C 53.868,141.293 38.021,138.111 26.373,136.664 32.383,117.86 42.832,100.179 57.727,85.285 68.941,74.071 81.87,65.197 95.92,58.898 c -0.781,0.832 -1.538,1.704 -2.252,2.627 -5.132,6.638 -6.665,13.818 -4.432,20.764 0.676,2.103 2.932,3.261 5.032,2.584 2.104,-0.676 3.26,-2.929 2.584,-5.032 -3.119,-9.701 6.766,-18.895 16.179,-23.821 8.789,-4.599 19.379,-7.341 31.542,-8.193 1.239,-0.035 2.48,-0.058 3.724,-0.058 12.251,0 24.237,1.717 35.691,5.022 2.36,0.884 4.63,1.872 6.793,2.972 5.949,3.025 9.001,6.12 9.604,9.737 0.85,5.096 -4.18,9.225 -6.381,10.763 -11.526,8.055 -26.655,7.89 -37.317,6.332 -2.189,-0.324 -4.217,1.194 -4.536,3.38 -0.319,2.186 1.194,4.217 3.38,4.536 3.699,0.54 7.881,0.924 12.299,0.924 10.028,0 21.264,-1.981 30.757,-8.614 7.284,-5.089 10.815,-11.882 9.689,-18.635 -0.103,-0.615 -0.243,-1.208 -0.409,-1.783 8.589,4.523 16.694,10.047 24.165,16.52 -8.145,14.582 -23.589,20.575 -35.122,23.032 -2.16,0.46 -3.538,2.585 -3.078,4.746 0.4,1.88 2.061,3.167 3.908,3.167 0.276,0 0.557,-0.029 0.838,-0.089 12.722,-2.711 29.678,-9.305 39.469,-25.296 0.273,0.269 0.551,0.531 0.823,0.803 23.661,23.662 36.104,54.354 37.344,85.415 -1.287,-1.834 -2.844,-3.479 -4.74,-4.841 z"
|
||||
id="path2"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 137.556,85.235 c 0.603,0.324 1.251,0.478 1.891,0.478 1.425,0 2.804,-0.764 3.526,-2.106 1.046,-1.946 0.317,-4.371 -1.628,-5.417 -1.062,-0.571 -6.264,-3.626 -4.383,-7.716 1.226,-2.667 4.829,-4.64 11.012,-6.032 6.876,-1.548 17.445,-1.943 24.605,2.034 1.188,0.66 1.884,1.448 1.862,2.11 -0.027,0.803 -0.928,2.024 -2.877,2.94 -2,0.94 -2.858,3.322 -1.919,5.322 0.94,1.999 3.322,2.859 5.321,1.918 4.54,-2.133 7.332,-5.838 7.47,-9.91 0.128,-3.778 -2.05,-7.195 -5.973,-9.374 -9.12,-5.066 -21.604,-4.792 -30.247,-2.845 -5.602,1.261 -13.409,3.721 -16.523,10.494 -3.061,6.654 0.099,13.93 7.863,18.104 z"
|
||||
id="path4"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 100.492,96.756 c 2.997,2.273 6.354,4.294 10.263,6.181 0.561,0.271 1.152,0.398 1.735,0.398 1.487,0 2.916,-0.833 3.605,-2.263 0.96,-1.99 0.125,-4.381 -1.864,-5.341 -3.424,-1.652 -6.337,-3.402 -8.906,-5.35 -1.76,-1.335 -4.27,-0.991 -5.604,0.77 -1.334,1.762 -0.989,4.271 0.771,5.605 z"
|
||||
id="path6"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 179.091,111.757 c 0.047,10e-4 4.807,-0.026 7.63,-0.253 2.202,-0.177 3.844,-2.106 3.667,-4.308 -0.177,-2.203 -2.137,-3.843 -4.308,-3.667 -4.037,0.325 -6.639,0.235 -6.68,0.233 -2.181,-0.089 -4.063,1.634 -4.149,3.84 -0.086,2.208 1.633,4.068 3.84,4.155 z"
|
||||
id="path8"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 201.867,133.619 c 0.336,0 9.337,-2.448 13.524,-3.81 2.101,-0.683 3.25,-2.94 2.566,-5.041 -0.684,-2.101 -2.938,-3.25 -5.041,-2.567 -4.04,1.314 -8.099,2.507 -12.062,3.547 -2.138,0.561 -3.415,2.748 -2.854,4.884 0.472,1.798 2.092,2.987 3.867,2.987 z"
|
||||
id="path10"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 187.617,128.737 c -46.298,8.716 -77.082,-4.029 -94.75,-16.257 -1.817,-1.257 -4.309,-0.804 -5.565,1.013 -1.257,1.816 -0.804,4.308 1.013,5.565 14.605,10.108 37.502,20.561 69.73,20.561 9.526,0 19.871,-0.914 31.054,-3.02 2.171,-0.409 3.6,-2.5 3.19,-4.671 -0.41,-2.172 -2.508,-3.602 -4.672,-3.191 z"
|
||||
id="path12"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 77.141,110.083 c 0.771,0.723 1.753,1.081 2.733,1.081 1.068,0 2.133,-0.425 2.92,-1.266 1.51,-1.612 1.427,-4.144 -0.185,-5.654 -3.733,-3.497 -5.615,-5.951 -5.675,-6.029 -1.327,-1.763 -3.831,-2.119 -5.596,-0.795 -1.768,1.326 -2.125,3.833 -0.8,5.6 0.092,0.121 2.267,3.001 6.603,7.063 z"
|
||||
id="path14"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 41.149,171.992 c -1.633,-0.278 -3.294,-0.535 -4.938,-0.763 -2.188,-0.302 -4.208,1.224 -4.512,3.411 -0.304,2.188 1.223,4.208 3.412,4.513 1.563,0.217 5.149,0.783 5.373,0.783 1.915,0 3.607,-1.379 3.938,-3.33 0.37,-2.178 -1.095,-4.244 -3.273,-4.614 z"
|
||||
id="path16"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 53.789,182.977 c 13.524,3.751 45.748,15.723 52.875,45.778 0.436,1.839 2.077,3.078 3.889,3.078 0.306,0 0.616,-0.035 0.926,-0.109 2.149,-0.51 3.479,-2.666 2.969,-4.815 -3.121,-13.162 -10.671,-24.582 -22.441,-33.944 -9.71,-7.724 -22.186,-13.843 -36.079,-17.697 -2.125,-0.589 -4.333,0.656 -4.924,2.785 -0.59,2.129 0.656,4.333 2.785,4.924 z"
|
||||
id="path18"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 110.315,242.16 c -2.004,-0.927 -4.382,-0.057 -5.311,1.948 -1.013,2.187 -2.39,4.152 -4.093,5.843 -1.568,1.557 -1.577,4.089 -0.02,5.657 0.782,0.788 1.81,1.182 2.838,1.182 1.019,0 2.039,-0.387 2.818,-1.162 2.378,-2.362 4.301,-5.106 5.715,-8.157 0.929,-2.005 0.057,-4.383 -1.947,-5.311 z"
|
||||
id="path20"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 90.255,255.468 c -8.356,1.642 -17.778,-1.182 -24.588,-7.365 -12.756,-11.582 -12.75,-24.255 -8.729,-29.174 3.817,-4.669 8.713,-5.013 12.147,-4.479 6.578,1.022 13.085,6.143 15.473,12.175 0.813,2.054 3.139,3.062 5.191,2.247 2.054,-0.813 3.06,-3.137 2.247,-5.191 -3.473,-8.774 -12.187,-15.66 -21.683,-17.136 -7.773,-1.208 -14.724,1.392 -19.57,7.321 -10.192,12.469 -0.554,30.991 9.545,40.16 6.995,6.351 16.232,9.895 25.219,9.894 2.12,0 4.228,-0.197 6.288,-0.602 2.168,-0.426 3.58,-2.528 3.155,-4.696 -0.425,-2.167 -2.526,-3.58 -4.695,-3.154 z"
|
||||
id="path22"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 82.824,236.937 c -2.256,1.781 -4.846,1.359 -6.622,0.692 -3.652,-1.372 -6.874,-4.924 -7.496,-8.263 -0.404,-2.171 -2.489,-3.603 -4.665,-3.2 -2.172,0.405 -3.604,2.493 -3.2,4.665 1.129,6.061 6.289,11.936 12.547,14.287 1.924,0.723 3.86,1.08 5.739,1.08 3.157,0 6.152,-1.008 8.651,-2.98 1.734,-1.368 2.031,-3.883 0.663,-5.618 -1.367,-1.735 -3.883,-2.032 -5.617,-0.663 z"
|
||||
id="path24"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 109.058,172.892 c -1.629,-1.493 -4.159,-1.385 -5.652,0.243 -1.494,1.628 -1.385,4.158 0.243,5.652 10.774,9.886 29.278,29.985 32.162,53.524 1.465,11.963 -1.974,23.543 -9.683,32.606 -3.238,3.808 -6.859,6.886 -10.763,9.15 -1.911,1.108 -2.562,3.556 -1.453,5.467 0.742,1.279 2.084,1.994 3.464,1.994 0.681,0 1.372,-0.174 2.003,-0.541 4.693,-2.722 9.014,-6.385 12.843,-10.887 9.176,-10.787 13.271,-24.552 11.53,-38.762 -3.196,-26.086 -23.109,-47.815 -34.694,-58.446 z"
|
||||
id="path26"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 94.011,170.834 c 0.716,0.531 1.551,0.788 2.379,0.788 1.223,0 2.431,-0.56 3.216,-1.618 1.316,-1.774 0.944,-4.28 -0.831,-5.595 -1.901,-1.41 -3.876,-2.792 -5.871,-4.108 -1.844,-1.217 -4.325,-0.708 -5.542,1.135 -1.217,1.844 -0.708,4.325 1.135,5.542 1.874,1.235 3.729,2.533 5.514,3.856 z"
|
||||
id="path28"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 151.585,173.576 c -1.26,-1.815 -3.749,-2.266 -5.564,-1.009 -1.815,1.257 -2.268,3.749 -1.012,5.564 0.312,0.451 30.974,45.477 13.988,80.185 -0.971,1.984 -0.149,4.38 1.835,5.351 0.565,0.277 1.165,0.408 1.755,0.408 1.479,0 2.901,-0.824 3.596,-2.243 7.945,-16.236 7.9,-36.706 -0.13,-59.195 -5.964,-16.7 -14.125,-28.565 -14.468,-29.061 z"
|
||||
id="path30"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 257.729,197.605 c 2.204,-1.072 3.393,3.135 3.063,8.028 -0.148,2.204 1.518,4.112 3.722,4.26 0.092,0.006 0.183,0.009 0.273,0.009 2.086,0 3.845,-1.618 3.987,-3.73 0.482,-7.146 -1.438,-12.739 -5.267,-15.344 -2.692,-1.832 -5.965,-1.991 -9.21,-0.45 -1.996,0.948 -2.845,3.334 -1.897,5.33 0.948,1.996 3.344,2.863 5.329,1.897 z"
|
||||
id="path32"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 219.052,227.503 c -0.246,1.928 -0.436,3.879 -0.563,5.801 -0.147,2.204 1.521,4.11 3.725,4.257 0.091,0.006 0.181,0.009 0.271,0.009 2.088,0 3.846,-1.62 3.987,-3.734 0.117,-1.762 0.291,-3.552 0.517,-5.322 0.279,-2.191 -1.271,-4.194 -3.463,-4.473 -2.187,-0.282 -4.195,1.272 -4.474,3.462 z"
|
||||
id="path34"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 215.557,170.546 c -1.205,1.852 -0.681,4.33 1.171,5.535 0.674,0.438 1.43,0.647 2.178,0.647 1.309,0 2.59,-0.641 3.356,-1.819 11.387,-17.501 23.308,-27.803 36.441,-31.495 2.127,-0.598 3.366,-2.806 2.769,-4.933 -0.598,-2.126 -2.809,-3.368 -4.933,-2.768 -15.084,4.24 -28.491,15.634 -40.982,34.833 z"
|
||||
id="path36"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 206.98,213.368 c 0.409,-2.171 -1.019,-4.263 -3.189,-4.672 -2.163,-0.412 -4.263,1.018 -4.672,3.189 -6.977,36.974 4.454,68.118 4.943,69.425 0.603,1.606 2.126,2.596 3.745,2.596 0.466,0 0.939,-0.082 1.4,-0.254 2.068,-0.773 3.118,-3.077 2.348,-5.146 -0.112,-0.3 -11.122,-30.441 -4.575,-65.138 z"
|
||||
id="path38"
|
||||
inkscape:connector-curvature="0" />
|
||||
|
||||
</g>
|
||||
<g
|
||||
id="g44"
|
||||
transform="translate(-12.275,-39.769)">
|
||||
</g>
|
||||
<g
|
||||
id="g46"
|
||||
transform="translate(-12.275,-39.769)">
|
||||
</g>
|
||||
<g
|
||||
id="g48"
|
||||
transform="translate(-12.275,-39.769)">
|
||||
</g>
|
||||
<g
|
||||
id="g50"
|
||||
transform="translate(-12.275,-39.769)">
|
||||
</g>
|
||||
<g
|
||||
id="g52"
|
||||
transform="translate(-12.275,-39.769)">
|
||||
</g>
|
||||
<g
|
||||
id="g54"
|
||||
transform="translate(-12.275,-39.769)">
|
||||
</g>
|
||||
<g
|
||||
id="g56"
|
||||
transform="translate(-12.275,-39.769)">
|
||||
</g>
|
||||
<g
|
||||
id="g58"
|
||||
transform="translate(-12.275,-39.769)">
|
||||
</g>
|
||||
<g
|
||||
id="g60"
|
||||
transform="translate(-12.275,-39.769)">
|
||||
</g>
|
||||
<g
|
||||
id="g62"
|
||||
transform="translate(-12.275,-39.769)">
|
||||
</g>
|
||||
<g
|
||||
id="g64"
|
||||
transform="translate(-12.275,-39.769)">
|
||||
</g>
|
||||
<g
|
||||
id="g66"
|
||||
transform="translate(-12.275,-39.769)">
|
||||
</g>
|
||||
<g
|
||||
id="g68"
|
||||
transform="translate(-12.275,-39.769)">
|
||||
</g>
|
||||
<g
|
||||
id="g70"
|
||||
transform="translate(-12.275,-39.769)">
|
||||
</g>
|
||||
<g
|
||||
id="g72"
|
||||
transform="translate(-12.275,-39.769)">
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 12 KiB |
150
frontend/www/static/res/assets/uranus.svg
Normal file
150
frontend/www/static/res/assets/uranus.svg
Normal file
|
|
@ -0,0 +1,150 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
id="Capa_1"
|
||||
x="0px"
|
||||
y="0px"
|
||||
viewBox="0 0 272.04324 272.17001"
|
||||
xml:space="preserve"
|
||||
sodipodi:docname="uranus-with-satellite.svg"
|
||||
inkscape:version="0.92.1 r15371"
|
||||
width="272.04324"
|
||||
height="272.17001"><metadata
|
||||
id="metadata61"><rdf:RDF><cc:Work
|
||||
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
|
||||
id="defs59" /><sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1536"
|
||||
inkscape:window-height="801"
|
||||
id="namedview57"
|
||||
showgrid="false"
|
||||
inkscape:zoom="0.69664401"
|
||||
inkscape:cx="-68.159453"
|
||||
inkscape:cy="136.0855"
|
||||
inkscape:window-x="-8"
|
||||
inkscape:window-y="-8"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="Capa_1" />
|
||||
<g
|
||||
id="g24"
|
||||
transform="translate(-66.724,-33.299)">
|
||||
<path
|
||||
d="M 298.973,73.157 C 273.271,47.454 239.096,33.299 202.746,33.299 c -36.35,0 -70.523,14.155 -96.227,39.858 -53.06,53.06 -53.06,139.394 0,192.454 25.703,25.703 59.877,39.858 96.227,39.858 36.35,0 70.524,-14.155 96.227,-39.858 53.059,-53.061 53.059,-139.395 0,-192.454 z m -5.657,186.796 c -11.681,11.681 -25.225,20.819 -39.956,27.156 17.744,-11.698 34.215,-26.208 48.558,-42.92 1.438,-1.676 1.246,-4.202 -0.43,-5.64 -1.678,-1.44 -4.202,-1.247 -5.641,0.43 -20.23,23.57 -48.084,44.664 -75.601,57.302 -5.753,0.781 -11.595,1.188 -17.501,1.188 -4.154,0 -8.276,-0.2 -12.359,-0.589 17.939,-6.343 34.995,-14.887 50.872,-25.52 1.836,-1.229 2.327,-3.714 1.098,-5.549 -1.229,-1.835 -3.712,-2.328 -5.549,-1.098 -19.625,13.143 -41.113,22.987 -63.873,29.279 -5.029,-1.193 -9.966,-2.688 -14.791,-4.477 4.071,-0.974 8.123,-2.079 12.128,-3.313 2.111,-0.651 3.296,-2.89 2.645,-5.001 -0.649,-2.11 -2.89,-3.294 -5,-2.645 -7.405,2.282 -14.973,4.095 -22.518,5.427 -11.638,-5.838 -22.419,-13.502 -31.997,-22.834 4.553,-0.896 9.091,-1.914 13.555,-3.076 2.138,-0.556 3.421,-2.74 2.864,-4.878 -0.555,-2.138 -2.736,-3.42 -4.878,-2.864 -5.959,1.55 -12.05,2.85 -18.137,3.902 C 96.417,242.502 88.55,229.31 83.208,215.361 c 7.844,-2.009 15.644,-4.451 23.246,-7.289 2.069,-0.772 3.121,-3.077 2.348,-5.146 -0.772,-2.069 -3.079,-3.122 -5.146,-2.348 -7.545,2.817 -15.292,5.233 -23.078,7.202 -1.7,-5.44 -3.033,-10.971 -3.992,-16.555 17.341,-5.604 33.99,-13.242 49.518,-22.786 1.882,-1.157 2.47,-3.62 1.313,-5.502 -1.158,-1.881 -3.62,-2.47 -5.503,-1.313 -14.584,8.964 -30.193,16.189 -46.445,21.555 -0.793,-7.386 -0.95,-14.826 -0.465,-22.234 8.314,-3.591 16.365,-7.688 23.955,-12.209 1.897,-1.13 2.521,-3.585 1.39,-5.483 -1.13,-1.898 -3.585,-2.521 -5.483,-1.39 -6.041,3.597 -12.387,6.918 -18.932,9.917 1.118,-8.127 3.015,-16.165 5.69,-23.995 12.924,-7.601 26.339,-17.69 37.186,-27.603 1.631,-1.49 1.745,-4.02 0.255,-5.651 -1.491,-1.632 -4.021,-1.745 -5.651,-0.254 -8.4,7.676 -17.365,14.679 -26.729,20.916 6.137,-13.178 14.632,-25.519 25.492,-36.379 24.192,-24.192 56.357,-37.516 90.57,-37.516 4.656,0 9.271,0.255 13.836,0.743 -1.347,4.072 -2.817,8.13 -4.393,12.113 -0.813,2.054 0.193,4.378 2.248,5.191 0.482,0.191 0.98,0.282 1.471,0.282 1.593,0 3.099,-0.958 3.721,-2.529 1.813,-4.582 3.485,-9.26 5.002,-13.947 5.613,0.961 11.128,2.297 16.52,3.984 -6.004,23.81 -15.831,46.266 -29.255,66.792 -1.209,1.849 -0.69,4.328 1.158,5.537 0.676,0.442 1.435,0.653 2.186,0.653 1.305,0 2.584,-0.638 3.352,-1.811 13.785,-21.077 23.913,-44.115 30.148,-68.536 14.147,5.434 27.287,13.409 38.866,23.679 -2.015,11.874 -5.07,23.73 -9.118,35.272 -0.731,2.084 0.365,4.367 2.45,5.099 0.438,0.154 0.885,0.227 1.324,0.227 1.651,0 3.197,-1.03 3.774,-2.677 3.599,-10.259 6.438,-20.76 8.495,-31.309 16.699,17.153 27.627,37.862 32.781,59.675 -6.798,23.85 -17.03,45.879 -30.438,65.486 -1.247,1.823 -0.779,4.313 1.044,5.56 0.69,0.472 1.477,0.699 2.254,0.699 1.276,0 2.531,-0.61 3.306,-1.743 11.018,-16.112 19.958,-33.794 26.699,-52.727 3.538,36.789 -8.748,74.828 -36.862,102.942 z"
|
||||
id="path2"
|
||||
inkscape:connector-curvature="0" />
|
||||
|
||||
<path
|
||||
d="m 197.27,216.666 c -1.811,1.267 -2.251,3.761 -0.984,5.571 0.778,1.112 2.02,1.707 3.281,1.707 0.791,0 1.592,-0.235 2.289,-0.723 22.879,-16.008 42.555,-36.287 58.479,-60.273 4.438,-6.686 8.573,-13.669 12.288,-20.754 1.025,-1.957 0.271,-4.375 -1.686,-5.4 -1.952,-1.025 -4.374,-0.272 -5.4,1.685 -3.587,6.843 -7.58,13.587 -11.866,20.044 -15.37,23.149 -34.347,42.711 -56.401,58.143 z"
|
||||
id="path6"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 164.66,235.919 c -4.826,2.292 -9.791,4.417 -14.757,6.314 -2.063,0.789 -3.098,3.101 -2.309,5.164 0.609,1.594 2.127,2.573 3.737,2.573 0.475,0 0.957,-0.085 1.427,-0.265 5.16,-1.972 10.319,-4.179 15.333,-6.561 1.996,-0.948 2.845,-3.334 1.897,-5.329 -0.946,-1.994 -3.333,-2.842 -5.328,-1.896 z"
|
||||
id="path8"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 240.418,146.561 c 1.275,-1.804 0.846,-4.3 -0.958,-5.575 -1.803,-1.275 -4.3,-0.845 -5.575,0.958 -30.046,42.51 -72.305,73.713 -118.993,87.863 -2.114,0.641 -3.309,2.874 -2.668,4.988 0.523,1.728 2.11,2.841 3.826,2.841 0.385,0 0.775,-0.056 1.162,-0.173 48.383,-14.663 92.138,-46.946 123.206,-90.902 z"
|
||||
id="path10"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 131.021,125.104 c 22.662,-18.894 41.814,-42.449 55.387,-68.119 1.032,-1.953 0.286,-4.373 -1.667,-5.406 -1.954,-1.035 -4.373,-0.286 -5.405,1.667 -13.09,24.758 -31.568,47.481 -53.438,65.714 -1.696,1.415 -1.926,3.937 -0.511,5.634 0.791,0.949 1.929,1.438 3.074,1.438 0.903,0 1.811,-0.304 2.56,-0.928 z"
|
||||
id="path12"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 304.583,162.73 c 0.537,0.244 1.1,0.359 1.653,0.359 1.52,0 2.974,-0.872 3.644,-2.346 0.838,-1.843 1.658,-3.714 2.44,-5.563 0.861,-2.034 -0.091,-4.381 -2.125,-5.242 -2.035,-0.861 -4.382,0.09 -5.242,2.125 -0.755,1.784 -1.548,3.59 -2.356,5.37 -0.914,2.012 -0.025,4.383 1.986,5.297 z"
|
||||
id="path14"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 301.081,169.845 c -1.931,-1.072 -4.365,-0.374 -5.438,1.557 -5.468,9.855 -11.719,19.443 -18.58,28.495 -25.229,33.293 -57.633,58.594 -93.705,73.166 -2.049,0.828 -3.038,3.159 -2.211,5.207 0.629,1.558 2.128,2.503 3.71,2.503 0.499,0 1.007,-0.094 1.497,-0.292 37.412,-15.114 70.983,-41.308 97.085,-75.752 7.089,-9.353 13.548,-19.26 19.2,-29.446 1.071,-1.932 0.374,-4.366 -1.558,-5.438 z"
|
||||
id="path16"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 190.943,141.11 c -4.038,4.545 -8.354,8.994 -12.827,13.222 -1.605,1.518 -1.678,4.049 -0.16,5.655 0.787,0.833 1.846,1.252 2.908,1.252 0.985,0 1.974,-0.362 2.746,-1.093 4.643,-4.387 9.122,-9.004 13.313,-13.723 1.468,-1.652 1.318,-4.18 -0.334,-5.647 -1.651,-1.466 -4.179,-1.318 -5.646,0.334 z"
|
||||
id="path18"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 161.323,130.713 c -1.609,1.514 -1.688,4.045 -0.174,5.654 0.787,0.837 1.85,1.26 2.915,1.26 0.982,0 1.967,-0.36 2.739,-1.086 18.801,-17.681 32.125,-35.242 40.733,-53.688 0.934,-2.001 0.068,-4.382 -1.934,-5.316 -2.001,-0.934 -4.382,-0.069 -5.316,1.933 -8.17,17.509 -20.915,34.271 -38.963,51.243 z"
|
||||
id="path20"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
d="m 148.218,142.343 c -3.322,2.801 -6.804,5.649 -10.644,8.706 -1.729,1.376 -2.014,3.893 -0.638,5.621 0.789,0.992 1.955,1.508 3.132,1.508 0.873,0 1.752,-0.285 2.488,-0.871 3.899,-3.104 7.438,-5.999 10.817,-8.849 1.689,-1.424 1.904,-3.948 0.479,-5.637 -1.422,-1.687 -3.947,-1.902 -5.634,-0.478 z"
|
||||
id="path22"
|
||||
inkscape:connector-curvature="0" />
|
||||
</g>
|
||||
<g
|
||||
id="g26"
|
||||
transform="translate(-66.724,-33.299)">
|
||||
</g>
|
||||
<g
|
||||
id="g28"
|
||||
transform="translate(-66.724,-33.299)">
|
||||
</g>
|
||||
<g
|
||||
id="g30"
|
||||
transform="translate(-66.724,-33.299)">
|
||||
</g>
|
||||
<g
|
||||
id="g32"
|
||||
transform="translate(-66.724,-33.299)">
|
||||
</g>
|
||||
<g
|
||||
id="g34"
|
||||
transform="translate(-66.724,-33.299)">
|
||||
</g>
|
||||
<g
|
||||
id="g36"
|
||||
transform="translate(-66.724,-33.299)">
|
||||
</g>
|
||||
<g
|
||||
id="g38"
|
||||
transform="translate(-66.724,-33.299)">
|
||||
</g>
|
||||
<g
|
||||
id="g40"
|
||||
transform="translate(-66.724,-33.299)">
|
||||
</g>
|
||||
<g
|
||||
id="g42"
|
||||
transform="translate(-66.724,-33.299)">
|
||||
</g>
|
||||
<g
|
||||
id="g44"
|
||||
transform="translate(-66.724,-33.299)">
|
||||
</g>
|
||||
<g
|
||||
id="g46"
|
||||
transform="translate(-66.724,-33.299)">
|
||||
</g>
|
||||
<g
|
||||
id="g48"
|
||||
transform="translate(-66.724,-33.299)">
|
||||
</g>
|
||||
<g
|
||||
id="g50"
|
||||
transform="translate(-66.724,-33.299)">
|
||||
</g>
|
||||
<g
|
||||
id="g52"
|
||||
transform="translate(-66.724,-33.299)">
|
||||
</g>
|
||||
<g
|
||||
id="g54"
|
||||
transform="translate(-66.724,-33.299)">
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 8.8 KiB |
114
frontend/www/static/res/assets/venus.svg
Normal file
114
frontend/www/static/res/assets/venus.svg
Normal file
|
|
@ -0,0 +1,114 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
id="Capa_1"
|
||||
x="0px"
|
||||
y="0px"
|
||||
viewBox="0 0 272.17001 272.17001"
|
||||
xml:space="preserve"
|
||||
sodipodi:docname="venus-with-satellite.svg"
|
||||
width="272.17001"
|
||||
height="272.17001"
|
||||
inkscape:version="0.92.1 r15371"><metadata
|
||||
id="metadata43"><rdf:RDF><cc:Work
|
||||
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
|
||||
id="defs41" /><sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1536"
|
||||
inkscape:window-height="801"
|
||||
id="namedview39"
|
||||
showgrid="false"
|
||||
inkscape:zoom="0.72525674"
|
||||
inkscape:cx="-54.610822"
|
||||
inkscape:cy="136.085"
|
||||
inkscape:window-x="-8"
|
||||
inkscape:window-y="-8"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="g6" />
|
||||
<g
|
||||
id="g6"
|
||||
transform="translate(-53.232,-26.616)">
|
||||
<path
|
||||
d="m 189.317,26.616 c -75.038,0 -136.085,61.048 -136.085,136.085 0,75.037 61.047,136.085 136.085,136.085 75.038,0 136.085,-61.047 136.085,-136.085 0,-75.038 -61.048,-136.085 -136.085,-136.085 z m 114.537,78.799 c -19.285,81.007 -76.736,147.79 -154.087,179.114 -5.259,-1.711 -10.371,-3.751 -15.309,-6.102 80.857,-31.451 141.937,-101.332 162.187,-185.549 2.629,4.029 5.038,8.214 7.209,12.537 z M 163.18,139.149 c 26.371,-28.772 46.301,-63.476 57.841,-100.56 13.174,3.367 25.536,8.784 36.729,15.887 -19.382,87.483 -83.595,159.155 -168.504,188.074 -8.839,-11.054 -15.885,-23.598 -20.7,-37.19 35.734,-14.765 68.396,-37.583 94.634,-66.211 z M 66.097,197.717 C 64.659,192.664 63.525,187.485 62.714,182.201 125,152.771 174.179,99.363 198.318,34.937 c 5.041,0.352 10.001,0.997 14.865,1.918 -11.221,35.723 -30.474,69.147 -55.901,96.888 -25.304,27.609 -56.763,49.647 -91.185,63.974 z M 189.317,34.616 c 0.192,0 0.382,0.006 0.573,0.007 -23.415,60.543 -69.7,110.809 -128.17,139.196 -0.317,-3.665 -0.488,-7.372 -0.488,-11.118 0,-70.626 57.458,-128.085 128.085,-128.085 z M 94.827,249.08 c 85.048,-30.115 149.458,-102 170.022,-189.755 9.626,7.052 18.236,15.411 25.562,24.818 -18.383,87.024 -81.532,159.278 -165.428,189.276 -11.251,-6.562 -21.416,-14.787 -30.156,-24.339 z m 67.417,38.818 c 71.824,-32.367 125.65,-94.933 146.817,-170.653 4.421,11.608 7.2,24.017 8.052,36.946 -20.52,57.053 -60.724,105.217 -113.336,135.774 -4.748,0.536 -9.571,0.821 -14.46,0.821 -9.287,0 -18.342,-1.002 -27.073,-2.888 z m 63.449,-2.382 c 39.622,-27.44 71.097,-65.121 90.95,-108.895 -5.626,51.82 -42.283,94.456 -90.95,108.895 z"
|
||||
id="path2"
|
||||
inkscape:connector-curvature="0" />
|
||||
|
||||
</g>
|
||||
<g
|
||||
id="g8"
|
||||
transform="translate(-53.232,-26.616)">
|
||||
</g>
|
||||
<g
|
||||
id="g10"
|
||||
transform="translate(-53.232,-26.616)">
|
||||
</g>
|
||||
<g
|
||||
id="g12"
|
||||
transform="translate(-53.232,-26.616)">
|
||||
</g>
|
||||
<g
|
||||
id="g14"
|
||||
transform="translate(-53.232,-26.616)">
|
||||
</g>
|
||||
<g
|
||||
id="g16"
|
||||
transform="translate(-53.232,-26.616)">
|
||||
</g>
|
||||
<g
|
||||
id="g18"
|
||||
transform="translate(-53.232,-26.616)">
|
||||
</g>
|
||||
<g
|
||||
id="g20"
|
||||
transform="translate(-53.232,-26.616)">
|
||||
</g>
|
||||
<g
|
||||
id="g22"
|
||||
transform="translate(-53.232,-26.616)">
|
||||
</g>
|
||||
<g
|
||||
id="g24"
|
||||
transform="translate(-53.232,-26.616)">
|
||||
</g>
|
||||
<g
|
||||
id="g26"
|
||||
transform="translate(-53.232,-26.616)">
|
||||
</g>
|
||||
<g
|
||||
id="g28"
|
||||
transform="translate(-53.232,-26.616)">
|
||||
</g>
|
||||
<g
|
||||
id="g30"
|
||||
transform="translate(-53.232,-26.616)">
|
||||
</g>
|
||||
<g
|
||||
id="g32"
|
||||
transform="translate(-53.232,-26.616)">
|
||||
</g>
|
||||
<g
|
||||
id="g34"
|
||||
transform="translate(-53.232,-26.616)">
|
||||
</g>
|
||||
<g
|
||||
id="g36"
|
||||
transform="translate(-53.232,-26.616)">
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.1 KiB |
|
|
@ -2,31 +2,8 @@
|
|||
precision mediump float;
|
||||
#endif
|
||||
|
||||
uniform int u_circle_count;
|
||||
uniform float u_time;
|
||||
uniform vec2 u_mouse;
|
||||
uniform vec4 u_viewbox; // [x, y, width, height]
|
||||
uniform vec2 u_resolution;
|
||||
uniform vec3 u_circles[$MAX_CIRCLES];
|
||||
uniform vec3 u_colors[$MAX_CIRCLES];
|
||||
|
||||
varying vec2 v_pos;
|
||||
uniform vec3 u_color;
|
||||
|
||||
void main() {
|
||||
vec2 uv = v_pos;
|
||||
|
||||
float alpha = 0.0;
|
||||
vec3 color;
|
||||
for (int i = 0; i < $MAX_CIRCLES; i++ ){
|
||||
if (i >= u_circle_count) { break; }
|
||||
float d = distance(uv.xy, u_circles[i].xy);
|
||||
float a = 1.0 - d/u_circles[i].z;
|
||||
if (a > alpha) {
|
||||
alpha = a;
|
||||
color = u_colors[i];
|
||||
}
|
||||
}
|
||||
|
||||
gl_FragColor = vec4(color, alpha);
|
||||
// gl_FragColor.w *= alpha;
|
||||
gl_FragColor = vec4(u_color, 1.0);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,17 +6,23 @@ attribute vec2 a_position;
|
|||
|
||||
uniform vec4 u_viewbox; // [x, y, width, height]
|
||||
uniform vec2 u_resolution;
|
||||
uniform mat3 u_trans;
|
||||
|
||||
varying vec2 v_pos;
|
||||
|
||||
void main() {
|
||||
vec3 pos = vec3(a_position, 1.0);
|
||||
|
||||
vec2 uv = ( a_position.xy + 1.0 ) * 0.5;
|
||||
pos = u_trans * pos;
|
||||
|
||||
uv *= u_viewbox.zw;
|
||||
uv += u_viewbox.xy;
|
||||
vec2 uv = pos.xy;
|
||||
|
||||
v_pos = uv.xy;
|
||||
// Viewbox's center is top left, a_position's is in the center to the screen
|
||||
// So translate and scale the viewbox**
|
||||
uv -= u_viewbox.xy + (u_viewbox.zw * 0.5);
|
||||
uv /= u_viewbox.zw * 0.5;
|
||||
|
||||
gl_Position = vec4(a_position.xy, 0.0, 1.0);
|
||||
v_pos = (uv.xy + 1.0) * 0.5;
|
||||
|
||||
gl_Position = vec4(uv.xy, 0.0, 1.0);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,45 +1,66 @@
|
|||
|
||||
import { Shader, Uniform4f, Uniform2fv, Uniform3fv, Uniform1i, Uniform1f, Uniform2f, ShaderFactory } from './shader';
|
||||
import { resizeCanvasToDisplaySize, FPSCounter, onload2promise, Resizer } from "./util";
|
||||
import { Shader, Uniform4f, Uniform2fv, Uniform3fv, Uniform1i, Uniform1f, Uniform2f, ShaderFactory, UniformMatrix3fv, Uniform3f } from './shader';
|
||||
import { resizeCanvasToDisplaySize, FPSCounter, onload2promise, Resizer, url_to_mesh } from "./util";
|
||||
import { VertexBuffer, IndexBuffer } from './buffer';
|
||||
import { VertexArray, VertexBufferLayout } from './vertexBufferLayout';
|
||||
import { Renderer } from './renderer';
|
||||
import { Texture } from './texture';
|
||||
|
||||
const URL = window.location.origin+window.location.pathname;
|
||||
const LOCATION = URL.substring(0, URL.lastIndexOf("/") + 1);
|
||||
|
||||
async function create_texture_from_svg(gl: WebGLRenderingContext, name: string, path: string, width: number, height: number): Promise<Texture> {
|
||||
|
||||
const [mesh, factory] = await Promise.all([
|
||||
url_to_mesh(path),
|
||||
ShaderFactory.create_factory(LOCATION + "static/shaders/frag/static_color.glsl", LOCATION + "static/shaders/vert/svg.glsl")
|
||||
]);
|
||||
|
||||
const program = factory.create_shader(gl);
|
||||
const renderer = new Renderer();
|
||||
|
||||
var positionBuffer = new VertexBuffer(gl, mesh.positions);
|
||||
var layout = new VertexBufferLayout();
|
||||
layout.push(gl.FLOAT, 3, 4, "a_position");
|
||||
|
||||
const vao = new VertexArray();
|
||||
vao.addBuffer(positionBuffer, layout);
|
||||
|
||||
program.bind(gl);
|
||||
vao.bind(gl, program);
|
||||
|
||||
var indexBuffer = new IndexBuffer(gl, mesh.cells);
|
||||
indexBuffer.bind(gl);
|
||||
|
||||
renderer.addToDraw(indexBuffer, vao, program, {});
|
||||
|
||||
return Texture.fromRenderer(gl, name, width, height, renderer);
|
||||
}
|
||||
|
||||
|
||||
async function main() {
|
||||
|
||||
const URL = window.location.origin+window.location.pathname;
|
||||
const LOCATION = URL.substring(0, URL.lastIndexOf("/") + 1);
|
||||
|
||||
|
||||
// Get A WebGL context
|
||||
var canvas = <HTMLCanvasElement>document.getElementById("c");
|
||||
const resolution = [canvas.width, canvas.height];
|
||||
|
||||
const resizer = new Resizer(canvas, [-100, -10, 200, 20], true);
|
||||
const resizer = new Resizer(canvas, [-10, -10, 20, 20], true);
|
||||
|
||||
var gl = canvas.getContext("webgl");
|
||||
if (!gl) {
|
||||
return;
|
||||
}
|
||||
|
||||
const mesh = await url_to_mesh("static/res/images/earth.svg");
|
||||
console.log(Math.max(...mesh.positions), Math.min(...mesh.positions));
|
||||
const renderer = new Renderer();
|
||||
|
||||
const factory = await ShaderFactory.create_factory(LOCATION + "static/shaders/frag/simple.glsl", LOCATION + "static/shaders/vert/simple.glsl");
|
||||
const program = factory.create_shader(gl, {"MAX_CIRCLES": "50"});
|
||||
const factory = await ShaderFactory.create_factory(LOCATION + "static/shaders/frag/static_color.glsl", LOCATION + "static/shaders/vert/simple.glsl");
|
||||
const program = factory.create_shader(gl);
|
||||
|
||||
var positions = [
|
||||
-1, -1, 0, 1,
|
||||
-1, 1, 0, 0,
|
||||
1, -1, 1, 1,
|
||||
1, 1, 1, 0,
|
||||
];
|
||||
|
||||
var positionBuffer = new VertexBuffer(gl, positions);
|
||||
var positionBuffer = new VertexBuffer(gl, mesh.positions);
|
||||
var layout = new VertexBufferLayout();
|
||||
layout.push(gl.FLOAT, 2, 4, "a_position");
|
||||
layout.push(gl.FLOAT, 2, 4, "a_tex");
|
||||
layout.push(gl.FLOAT, 3, 4, "a_position");
|
||||
// layout.push(gl.FLOAT, 2, 4, "a_tex");
|
||||
|
||||
const vao = new VertexArray();
|
||||
vao.addBuffer(positionBuffer, layout);
|
||||
|
|
@ -59,40 +80,23 @@ async function main() {
|
|||
program.bind(gl);
|
||||
vao.bind(gl, program);
|
||||
|
||||
var indices = [
|
||||
0, 1, 2,
|
||||
1, 2, 3,
|
||||
];
|
||||
|
||||
var indexBuffer = new IndexBuffer(gl, indices);
|
||||
var indexBuffer = new IndexBuffer(gl, mesh.cells);
|
||||
indexBuffer.bind(gl);
|
||||
|
||||
renderer.addToDraw(indexBuffer, vao, program);
|
||||
|
||||
var blue = 1.0;
|
||||
var inc = 0.05;
|
||||
renderer.addToDraw(indexBuffer, vao, program, {});
|
||||
|
||||
const counter = new FPSCounter();
|
||||
|
||||
const step = function (time: number) {
|
||||
blue += inc;
|
||||
// if (blue > 1.0 || blue < 0.0) {
|
||||
// inc = -1 * inc;
|
||||
// blue += inc;
|
||||
// }
|
||||
|
||||
program.uniform(gl, "u_circle_count", new Uniform1i(3));
|
||||
// console.log(resizer.get_viewbox());
|
||||
|
||||
program.uniform(gl, "u_time", new Uniform1f(time * 0.001));
|
||||
program.uniform(gl, "u_mouse", new Uniform2f(resizer.get_mouse_pos()));
|
||||
program.uniform(gl, "u_viewbox", new Uniform4f(resizer.get_viewbox()));
|
||||
program.uniform(gl, "u_resolution", new Uniform2f(resolution));
|
||||
program.uniform(gl, "u_circles", new Uniform3fv([
|
||||
0, 0, 3.5,
|
||||
-2, -2, 2,
|
||||
5, 2, 4,
|
||||
]));
|
||||
program.uniform(gl, "u_color", new Uniform4f([1, blue, 0, 1]));
|
||||
program.uniform(gl, "u_trans", new UniformMatrix3fv([1, 0, 0, 0, 1, 0, 0, 0, 1]));
|
||||
program.uniform(gl, "u_color", new Uniform3f(1.0, 0.5, 0.0));
|
||||
|
||||
renderer.render(gl);
|
||||
|
||||
|
|
@ -103,6 +107,7 @@ async function main() {
|
|||
requestAnimationFrame(step);
|
||||
}
|
||||
|
||||
|
||||
main();
|
||||
|
||||
document.getElementById("loader").classList.remove("loading");
|
||||
|
|
|
|||
|
|
@ -1,8 +1,9 @@
|
|||
|
||||
import { IndexBuffer } from './buffer';
|
||||
import { Shader, Uniform1i } from './shader';
|
||||
import { Shader, Uniform1i, Uniform } from './shader';
|
||||
import { VertexArray } from './vertexBufferLayout';
|
||||
import { Texture } from './texture';
|
||||
import { Dictionary } from './util';
|
||||
|
||||
export interface Renderable {
|
||||
render(gl: WebGLRenderingContext): void;
|
||||
|
|
@ -15,34 +16,49 @@ export class Renderer {
|
|||
vertexArrays: VertexArray[];
|
||||
shaders: Shader[];
|
||||
textures: Texture[];
|
||||
uniforms: Dictionary<Uniform>[];
|
||||
|
||||
constructor() {
|
||||
this.indexBuffers = [];
|
||||
this.vertexArrays = [];
|
||||
this.shaders = [];
|
||||
this.textures = [];
|
||||
this.uniforms = [];
|
||||
}
|
||||
|
||||
updateUniform(i: number, f: (uniforms: Dictionary<Uniform>) => void) {
|
||||
f(this.uniforms[i]);
|
||||
}
|
||||
|
||||
addRenderable(item: Renderable) {
|
||||
this.renderables.push(item);
|
||||
}
|
||||
|
||||
addToDraw(indexBuffer: IndexBuffer, vertexArray: VertexArray, shader: Shader, texture?: Texture): number {
|
||||
addToDraw(indexBuffer: IndexBuffer, vertexArray: VertexArray, shader: Shader, uniforms: Dictionary<Uniform>,texture?: Texture): number {
|
||||
this.indexBuffers.push(indexBuffer);
|
||||
this.vertexArrays.push(vertexArray);
|
||||
this.shaders.push(shader);
|
||||
this.textures.push(texture);
|
||||
|
||||
this.uniforms.push(uniforms);
|
||||
|
||||
|
||||
return this.indexBuffers.length - 1;
|
||||
}
|
||||
|
||||
render(gl: WebGLRenderingContext) {
|
||||
render(gl: WebGLRenderingContext, frameBuffer?: WebGLFramebuffer, width?: number, height?: number) {
|
||||
gl.bindFramebuffer(gl.FRAMEBUFFER, frameBuffer);
|
||||
gl.viewport(0, 0, width || gl.canvas.width, height || gl.canvas.height);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
|
||||
|
||||
const maxTextures = gl.getParameter(gl.MAX_VERTEX_TEXTURE_IMAGE_UNITS);
|
||||
let texLocation = 0;
|
||||
|
||||
for(let i = 0; i < this.indexBuffers.length; i ++) {
|
||||
const indexBuffer = this.indexBuffers[i];
|
||||
const vertexArray = this.vertexArrays[i];
|
||||
const uniforms = this.uniforms[i];
|
||||
|
||||
const shader = this.shaders[i];
|
||||
const texture = this.textures[i];
|
||||
|
||||
|
|
@ -56,10 +72,14 @@ export class Renderer {
|
|||
console.error("Using too many textures, this is not supported yet\nUndefined behaviour!");
|
||||
}
|
||||
}
|
||||
|
||||
if (vertexArray && shader) {
|
||||
|
||||
if (vertexArray && shader && uniforms) {
|
||||
for(let key in uniforms) {
|
||||
shader.uniform(gl, key, uniforms[key]);
|
||||
}
|
||||
|
||||
vertexArray.bind(gl, shader);
|
||||
|
||||
|
||||
if (indexBuffer) {
|
||||
indexBuffer.bind(gl);
|
||||
gl.drawElements(gl.TRIANGLES, indexBuffer.getCount(), gl.UNSIGNED_SHORT, 0);
|
||||
|
|
|
|||
|
|
@ -304,3 +304,14 @@ export class Uniform4f implements Uniform {
|
|||
gl.uniform4f(location, this.v0, this.v1, this.v2, this.v3);
|
||||
}
|
||||
}
|
||||
|
||||
export class UniformMatrix3fv implements Uniform {
|
||||
data: number[];
|
||||
constructor(data: number[]) {
|
||||
this.data = data;
|
||||
}
|
||||
|
||||
setUniform(gl: WebGLRenderingContext, location: WebGLUniformLocation) {
|
||||
gl.uniformMatrix3fv(location, false, this.data);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,25 +1,62 @@
|
|||
import { Renderer } from "./renderer";
|
||||
|
||||
|
||||
// TODO: fix texture locations, not use only 0
|
||||
export class Texture {
|
||||
texture: WebGLTexture;
|
||||
image: HTMLImageElement;
|
||||
width: number;
|
||||
height: number;
|
||||
loaded: boolean;
|
||||
name: string;
|
||||
|
||||
constructor(
|
||||
static fromImage(
|
||||
gl: WebGLRenderingContext,
|
||||
path: string,
|
||||
name: string,
|
||||
): Texture {
|
||||
const out = new Texture(gl, name);
|
||||
|
||||
const image = new Image();
|
||||
image.onload = out.setImage.bind(out, gl, image);
|
||||
image.onerror = error;
|
||||
image.src = path;
|
||||
|
||||
return out;
|
||||
}
|
||||
|
||||
static fromRenderer(
|
||||
gl: WebGLRenderingContext,
|
||||
name: string,
|
||||
width: number,
|
||||
height: number,
|
||||
renderer: Renderer
|
||||
): Texture {
|
||||
const out = new Texture(gl, name);
|
||||
out.width = width;
|
||||
out.height = height;
|
||||
|
||||
gl.texImage2D(
|
||||
gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0,
|
||||
gl.RGBA, gl.UNSIGNED_BYTE, null);
|
||||
|
||||
const fb = gl.createFramebuffer();
|
||||
gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
|
||||
|
||||
const attachmentPoint = gl.COLOR_ATTACHMENT0;
|
||||
gl.framebufferTexture2D(gl.FRAMEBUFFER, attachmentPoint, gl.TEXTURE_2D, out.texture, 0);
|
||||
|
||||
renderer.render(gl, fb, width, height);
|
||||
|
||||
out.loaded = true;
|
||||
|
||||
return out;
|
||||
}
|
||||
|
||||
constructor(
|
||||
gl: WebGLRenderingContext,
|
||||
name: string,
|
||||
) {
|
||||
this.loaded = false;
|
||||
this.name = name;
|
||||
|
||||
this.image = new Image();
|
||||
this.image.onload = () => this.handleImageLoaded(gl);
|
||||
this.image.onerror = error;
|
||||
this.image.src = path;
|
||||
|
||||
this.texture = gl.createTexture();
|
||||
this.bind(gl);
|
||||
|
||||
|
|
@ -32,11 +69,12 @@ export class Texture {
|
|||
gl.UNSIGNED_BYTE, new Uint8Array([255, 0, 0, 255]));
|
||||
}
|
||||
|
||||
handleImageLoaded(gl: WebGLRenderingContext) {
|
||||
console.log('handling image loaded');
|
||||
setImage(gl: WebGLRenderingContext, image: HTMLImageElement) {
|
||||
this.bind(gl);
|
||||
this.width = image.width;
|
||||
this.height = image.height;
|
||||
|
||||
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, this.image);
|
||||
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image);
|
||||
|
||||
this.unbind(gl);
|
||||
|
||||
|
|
@ -54,11 +92,11 @@ export class Texture {
|
|||
|
||||
|
||||
getWidth(): number {
|
||||
return this.image.width;
|
||||
return this.width;
|
||||
}
|
||||
|
||||
getHeight(): number {
|
||||
return this.image.height;
|
||||
return this.height;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,3 +1,6 @@
|
|||
var loadSvg = require('load-svg')
|
||||
var parsePath = require('extract-svg-path').parse
|
||||
var svgMesh3d = require('svg-mesh-3d')
|
||||
|
||||
export interface Dictionary<T> {
|
||||
[Key: string]: T;
|
||||
|
|
@ -159,10 +162,38 @@ export class Resizer {
|
|||
}
|
||||
|
||||
get_viewbox(): number[] {
|
||||
return this.viewbox;
|
||||
return this.viewbox;
|
||||
// return [this.viewbox[0] / this.orig_viewbox[0], this.viewbox[1] / this.orig_viewbox[1], this.viewbox[2] / this.orig_viewbox[2], this.viewbox[3] / this.orig_viewbox[3],];
|
||||
}
|
||||
|
||||
get_mouse_pos(): number[] {
|
||||
return this.mouse_pos;
|
||||
}
|
||||
}
|
||||
|
||||
export class Mesh {
|
||||
cells: number[];
|
||||
positions: number[];
|
||||
|
||||
constructor(mesh: any) {
|
||||
this.cells = mesh.cells.flat();
|
||||
this.positions = mesh.positions.flat();
|
||||
}
|
||||
}
|
||||
|
||||
export async function url_to_mesh(url: string): Promise<Mesh> {
|
||||
|
||||
return new Promise(function(resolve) {
|
||||
loadSvg(url, function (err: any, svg: any) {
|
||||
if (err) throw err;
|
||||
|
||||
var svgPath = parsePath(svg);
|
||||
var mesh = svgMesh3d(svgPath, {
|
||||
delaunay: false,
|
||||
scale: 10,
|
||||
});
|
||||
|
||||
resolve(new Mesh(mesh));
|
||||
});
|
||||
});
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue